-
Posts
-
And here’s functions.php
<?php // ============================================================================= // FUNCTIONS.PHP // ----------------------------------------------------------------------------- // Overwrite or add your own custom functions to X in this file. // ============================================================================= function x_social_global() { $facebook = x_get_option( 'x_social_facebook' ); $twitter = x_get_option( 'x_social_twitter' ); $google_plus = x_get_option( 'x_social_googleplus' ); $linkedin = x_get_option( 'x_social_linkedin' ); $foursquare = x_get_option( 'x_social_foursquare' ); $youtube = x_get_option( 'x_social_youtube' ); $vimeo = x_get_option( 'x_social_vimeo' ); $instagram = x_get_option( 'x_social_instagram' ); $pinterest = x_get_option( 'x_social_pinterest' ); $dribbble = x_get_option( 'x_social_dribbble' ); $behance = x_get_option( 'x_social_behance' ); $tumblr = x_get_option( 'x_social_tumblr' ); $rss = x_get_option( 'x_social_rss' ); $output = '<div class="x-social-global">'; if ( $facebook ) : $output .= '<a href="' . $facebook . '" class="facebook" title="Facebook" target="_blank"><i class="x-social-facebook"></i></a>'; endif; if ( $twitter ) : $output .= '<a href="' . $twitter . '" class="twitter" title="Twitter" target="_blank"><i class="x-social-twitter"></i></a>'; endif; if ( $google_plus ) : $output .= '<a href="' . $google_plus . '" class="google-plus" title="Google+" target="_blank"><i class="x-social-google-plus"></i></a>'; endif; if ( $linkedin ) : $output .= '<a href="' . $linkedin . '" class="linkedin" title="LinkedIn" target="_blank"><i class="x-social-linkedin"></i></a>'; endif; if ( $foursquare ) : $output .= '<a href="' . $foursquare . '" class="foursquare" title="Foursquare" target="_blank"><i class="x-social-foursquare"></i></a>'; endif; if ( $youtube ) : $output .= '<a href="' . $youtube . '" class="youtube" title="YouTube" target="_blank"><i class="x-social-youtube"></i></a>'; endif; if ( $vimeo ) : $output .= '<a href="' . $vimeo . '" class="vimeo" title="Vimeo" target="_blank"><i class="x-social-vimeo"></i></a>'; endif; if ( $instagram ) : $output .= '<a href="' . $instagram . '" class="instagram" title="Instagram" target="_blank"><i class="x-social-instagram"></i></a>'; endif; if ( $pinterest ) : $output .= '<a href="' . $pinterest . '" class="pinterest" title="Pinterest" target="_blank"><i class="x-social-pinterest"></i></a>'; endif; if ( $dribbble ) : $output .= '<a href="' . $dribbble . '" class="dribbble" title="Dribbble" target="_blank"><i class="x-social-dribbble"></i></a>'; endif; if ( $behance ) : $output .= '<a href="' . $behance . '" class="behance" title="Behance" target="_blank"><i class="x-social-behance"></i></a>'; endif; if ( $tumblr ) : $output .= '<a href="' . $tumblr . '" class="tumblr" title="Tumblr" target="_blank"><i class="x-social-tumblr"></i></a>'; endif; if ( $rss ) : $output .= '<a href="' . $rss . '" class="rss" title="RSS" target="_blank"><i class="x-social-rss"></i></a>'; endif; $output .= '<a style="position: relative;top: -2px;" href="http://vk.com/bhumibrushes" class="vk" title="VK" target="_blank"><i class="x-icon-vk"></i></a></div>'; echo $output; } add_action('wp_head', function(){ remove_shortcode( 'share' ); add_shortcode( 'share', function ( $atts ) { extract( shortcode_atts( array( 'id' => '', 'class' => '', 'style' => '', 'title' => '', 'facebook' => '', 'twitter' => '', 'google_plus' => '', 'linkedin' => '', 'pinterest' => '', 'reddit' => '', 'email' => '' ), $atts ) ); $share_url = urlencode( get_permalink() ); $share_title = urlencode( get_the_title() ); $share_source = urlencode( get_bloginfo( 'name' ) ); $share_content = urlencode( get_the_excerpt() ); $share_media_info = wp_get_attachment_image_src( get_post_thumbnail_id(), 'full' ); $share_media = $share_media_info[0]; $id = ( $id != '' ) ? 'id="' . esc_attr( $id ) . '"' : ''; $class = ( $class != '' ) ? 'x-entry-share ' . esc_attr( $class ) : 'x-entry-share'; $style = ( $style != '' ) ? 'style="' . $style . '"' : ''; $title = ( $title != '' ) ? $title : __( 'Share this Post', '__x__' ); $facebook = ( $facebook == 'true' ) ? "<a href=\"#share\" data-toggle=\"tooltip\" data-placement=\"bottom\" data-trigger=\"hover\" class=\"x-share\" title=\"" . __( 'Share on Facebook', '__x__' ) . "\" onclick=\"window.open('http://www.facebook.com/sharer.php?u={$share_url}&t={$share_title}', 'popupFacebook', 'width=650, height=270, resizable=0, toolbar=0, menubar=0, status=0, location=0, scrollbars=0'); return false;\"><i class=\"x-social-facebook\"></i></a>" : ''; $twitter = ( $twitter == 'true' ) ? "<a href=\"#share\" data-toggle=\"tooltip\" data-placement=\"bottom\" data-trigger=\"hover\" class=\"x-share\" title=\"" . __( 'Share on Twitter', '__x__' ) . "\" onclick=\"window.open('https://twitter.com/intent/tweet?text={$share_title}&url={$share_url}', 'popupTwitter', 'width=500, height=370, resizable=0, toolbar=0, menubar=0, status=0, location=0, scrollbars=0'); return false;\"><i class=\"x-social-twitter\"></i></a>" : ''; $google_plus = ( $google_plus == 'true' ) ? "<a href=\"#share\" data-toggle=\"tooltip\" data-placement=\"bottom\" data-trigger=\"hover\" class=\"x-share\" title=\"" . __( 'Share on Google+', '__x__' ) . "\" onclick=\"window.open('https://plus.google.com/share?url={$share_url}', 'popupGooglePlus', 'width=650, height=226, resizable=0, toolbar=0, menubar=0, status=0, location=0, scrollbars=0'); return false;\"><i class=\"x-social-google-plus\"></i></a>" : ''; $linkedin = ( $linkedin == 'true' ) ? "<a href=\"#share\" data-toggle=\"tooltip\" data-placement=\"bottom\" data-trigger=\"hover\" class=\"x-share\" title=\"" . __( 'Share on LinkedIn', '__x__' ) . "\" onclick=\"window.open('http://www.linkedin.com/shareArticle?mini=true&url={$share_url}&title={$share_title}&summary={$share_content}&source={$share_source}', 'popupLinkedIn', 'width=610, height=480, resizable=0, toolbar=0, menubar=0, status=0, location=0, scrollbars=0'); return false;\"><i class=\"x-social-linkedin\"></i></a>" : ''; $pinterest = ( $pinterest == 'true' ) ? "<a href=\"#share\" data-toggle=\"tooltip\" data-placement=\"bottom\" data-trigger=\"hover\" class=\"x-share\" title=\"" . __( 'Share on Pinterest', '__x__' ) . "\" onclick=\"window.open('http://pinterest.com/pin/create/button/?url={$share_url}&media={$share_media}&description={$share_title}', 'popupPinterest', 'width=750, height=265, resizable=0, toolbar=0, menubar=0, status=0, location=0, scrollbars=0'); return false;\"><i class=\"x-social-pinterest\"></i></a>" : ''; $reddit = ( $reddit == 'true' ) ? "<a href=\"#share\" data-toggle=\"tooltip\" data-placement=\"bottom\" data-trigger=\"hover\" class=\"x-share\" title=\"" . __( 'Share on Reddit', '__x__' ) . "\" onclick=\"window.open('http://www.reddit.com/submit?url={$share_url}', 'popupReddit', 'width=875, height=450, resizable=0, toolbar=0, menubar=0, status=0, location=0, scrollbars=0'); return false;\"><i class=\"x-social-reddit\"></i></a>" : ''; $email = ( $email == 'true' ) ? "<a href=\"mailto:?subject=" . get_the_title() . "&body=" . __( 'Hey, thought you might enjoy this! Check it out when you have a chance:', '__x__' ) . " " . get_permalink() . "\" data-toggle=\"tooltip\" data-placement=\"bottom\" data-trigger=\"hover\" class=\"x-share email\" title=\"" . __( 'Share via Email', '__x__' ) . "\"><span><i class=\"x-icon-envelope\"></i></span></a>" : ''; $vk = "<a href=\"#share\" data-toggle=\"tooltip\" data-placement=\"bottom\" data-trigger=\"hover\" class=\"x-share\" title=\"" . __( 'Share on VK', '__x__' ) . "\" ><i class=\"x-icon-vk\"></i></a>"; $output = "<div {$id} class=\"{$class}\" {$style}>" . '<p>' . $title . '</p>' . '<div class="x-share-options">' . $facebook . $twitter . $google_plus . $linkedin . $pinterest . $reddit . $email . $vk . '</div>' . '</div>'; return $output; } ); });Hi there,
Remove this
<a href="PUT VK URL HERE"><i class="x-icon-vk"></i></a>from _content-post-header.phpIt’s already moved under social sharing code given and it doesn’t need to be added on templates too.
Thanks.
Hi
Okay, removed it and it took care of the extra VK button, it’s gone.
However, the buttons are still above the content instead of below. And how do I adjust the VK button position?
Here’s the screen shot. https://www.dropbox.com/s/7m9rhpmybx32fo0/Screen3.bmp?dl=0
Thank you!
Hey Alexei,
Please give us the URL of the page so we could see the problem with the icons.
Thanks.
There you are:
http://bhumibrushes.ru/transformations/
http://bhumibrushes.ru/magazine/Thanks
Please add the code below in the Appearance > Customize > Custom > CSS.
.x-icon-vk:before { position: relative; top: -2px; }Hope that helps.
Sure, thanks! What about moving the buttons from the top to the bottom of the post?
Thanks!
Also, this code did not remove the buttons from the blog front page
.blog .custom-social {
display: none;
}Thanks!
Hi there,
Please add the code below into Customize -> Custom -> Javascript:
jQuery('.x-entry-share').each(function(){ jQuery(this).appendTo(jQuery(this).closest('.entry-wrap').find('.entry-content')); });Hope it helps.
Awesome, it did the trick. And how do I now adjust the position of the buttons to get rid of the extra white space in the post?
http://bhumibrushes.ru/transformations/
And the buttons are still on the main blog page…
Thank you very much!
Hi there,
Would you please check the blog post that you have added. It seems there are some extra paragraphs there which made that gap.
I am confused about the second question. You do NOT want to have social media icons in blog main page?
Thank you.
Uhh… Sorry, you’re right, something got in there.
No, I do not want the social media icons in blog main page (except for the ones in the footer of course), only on posts.
I’m working on achieving a certain consistent look throughout the site, I would be really grateful if you showed me how to strip those lines from the social media icons and perhaps move the icons to the bottom of the post while being able to control the amount of white space between the content and the icons.
Thank you, thank you
Hi Alexei,
To add more space between content & sharing options, add the following CSS codes via Appearance > Customize > Custom > CSS:
.single .x-entry-share { margin-top: 60px !important; }Thanks. Okay, maybe my questions need some clarification, sorry if this is confusing.
I’m looking to
1. Have no social media icons on post previews on main blog page.
2. Be able to turn on/off the lines above and below the social media icons as well as “share this” above the icons.
Thank you!
Hi Alexei,
OK, then remove the previous CSS just given in previous reply & add the following:
.x-entry-share { display: none; } .single .x-entry-share { border-width: 0 !important; display: block !important; margin-bottom: -30px !important; margin-top: 60px !important; }
