[Resolved] Social media icons

Home Forums Support [Resolved] Social media icons

Home Forums Support Social media icons

Viewing 15 posts - 1 through 15 (of 17 total)
  • Author
    Posts
  • #554705
    Clare

    I’ve got a couple questions here:

    1. How can I get social media icons directly beneath my “About” section? Right now they’re sitting in a separate widget right beneath the about widget.
    2. I’d like to align the nav bar social icons all the way to the right, with other menu options all the way on the left. Also, when in mobile version, I’d like the social icons to remain to the right, but the other menu options hamburger style, like this site: http://www.kwernerdesign.com
    3. Is there a good way, or at least a lightweight, easily customizable plugin, to add social media icons beneath the “continue reading” and then at the bottom of the blog post itself? Like this site: http://mayholicdesign.com

    I was able to find half answers to a few of these in forums, but I’ve reached the point where I’m not sure what’s the best way to tackle these. Thanks!

    GP Premium 1.6.2
    #554935
    Leo
    Staff
    Customer Support

    Hi there,

    1. Are you referring to the sidebar widget? You just need to add them to the same widget above.

    2. Set both navigation width to full: https://docs.generatepress.com/article/navigation-layout/ then align to the left: https://docs.generatepress.com/article/navigation-layout/#navigation-alignment

    And keep the menu-item-float-right class you’ve added.

    That should work to split them to two sides.

    3. Hmm try using the after content hook with conditional tag plus FontAwesome icons:
    https://docs.generatepress.com/article/hooks-overview/
    http://demo.generatepress.com/hook-locations/
    https://docs.generatepress.com/article/using-hooks-conditional-tags/#blog-posts-page

    Let me know me if this gets you closer 🙂

    #571871
    Clare

    Thanks Leo!
    1. I decided against moving the icons.
    2. I had the menu centered earlier and forgot, so following your align left worked perfectly.
    3. I’ve looked at some of the hook documentation, and to be honest, it confuses me. If I just wanted to move the tags from below the excerpt, to next to the date (which is under the title), would I still need to use a hook?

    #571927
    Leo
    Staff
    Customer Support
    #573383
    Clare

    I disabled tags in Customize > Layout > Blog, and then added the code Tom provided in the Code Snippets plugin, but no luck. Not sure if I’m missing some other crucial step…¯\_(ツ)_/¯

    #573447
    Leo
    Staff
    Customer Support

    Hmm I just tested and the code worked for me.

    What if you activate post author?

    #573458
    Clare

    That works! How should I edit the code so that I don’t have the author showing, just date, categories and tags, all on the same line? (And with the tags, preferably without the tag icon)

    This is what I’m using:

    add_filter( 'generate_post_author_output', 'tu_add_tags_to_author' );
    function tu_add_tags_to_author( $output ) {
        $tags_list = get_the_tag_list( '', _x( ', ', 'Used between list items, there is a space after the comma.', 'generatepress' ) );
        $tags = apply_filters( 'generate_tag_list_output', sprintf( '<span class="tags-links"><span class="screen-reader-text">%1$s </span>%2$s</span>',
            _x( 'Tags', 'Used before tag names.', 'generatepress' ),
            $tags_list
        ) );
    
        return $output . $tags;
    }
    #573635
    Leo
    Staff
    Customer Support

    Try this additional CSS:

    .author.vcard, .tags-links:before {
        display: none;
    }
    #573658
    Clare

    So close! Got rid of author, but isn’t showing categories, and the tags and date aren’t on the same line.

    #573703
    Leo
    Staff
    Customer Support

    Ok so just to make sure.

    The order you want is date, tags (without icon) then categories (with icon)?

    #573711
    Clare

    That’s all correct, except categories also without icon.

    #574027
    Leo
    Staff
    Customer Support

    So how should tags and categories be separated?

    #575139
    Clare

    If possible, vertical bar – | . Sorry to be a pain about such minuscule details – I normally can tinker around with the CSS, but this function has me confused.

    #575474
    Leo
    Staff
    Customer Support

    Can you try this snippet instead:

    add_filter( 'generate_post_author_output', 'tu_categories_to_author' );
    add_filter( 'generate_category_list_output', '__return_false' );
    add_filter( 'generate_tag_list_output', '__return_false' );
    add_filter( 'generate_show_comments', '__return_false' );
    function tu_categories_to_author( $output ) {
        $categories_list = get_the_category_list( _x( ', ', 'Used between list items, there is a space after the comma.', 'generatepress' ) );
        $categories_list = sprintf( '<span class="cat-links"><span class="screen-reader-text">%1$s </span>%2$s</span>',
            _x( 'Categories', 'Used before category names.', 'generatepress' ),
            $categories_list
        );
    	
    	$tags_list = get_the_tag_list( '', _x( ', ', 'Used between list items, there is a space after the comma.', 'generatepress' ) );
    	$tags_list = sprintf( '<span class="tags-links"><span class="screen-reader-text">%1$s </span>%2$s</span>',
    		_x( 'Tags', 'Used before tag names.', 'generatepress' ),
    		$tags_list
    	);
    
      echo $output . $categories_list . ' | ' . $tags_list;
      
      if ( ! is_single() && ! post_password_required() && ( comments_open() || get_comments_number() ) ) {
    			echo '<span class="comments-link">';
    				comments_popup_link( __( 'Leave a comment', 'generatepress' ), __( '1 Comment', 'generatepress' ), __( '% Comments', 'generatepress' ) );
    			echo '</span>';
    		}
    }

    and this CSS:

    .entry-header .entry-meta > * {
        display: inline-block;
        margin-right: 20px;
    }
    .cat-links:before, .tags-links:before {
        display: none;
    }
    #578080
    Clare

    Categories are now in! However, there’s a weird space between the categories and the vertical bar, and I’m not sure where to fix that. I didn’t want comments showing, so I already took that out. Here’s my code at this point:

    add_filter( 'generate_post_author_output', 'tu_categories_to_author' );
    add_filter( 'generate_category_list_output', '__return_false' );
    add_filter( 'generate_tag_list_output', '__return_false' );
    function tu_categories_to_author( $output ) {
        $categories_list = get_the_category_list( _x( ', ', 'Used between list items, there is a space after the comma.', 'generatepress' ) );
        $categories_list = sprintf( '<span class="cat-links"><span class="screen-reader-text">%1$s </span>%2$s</span>',
            _x( 'Categories', 'Used before category names.', 'generatepress' ),
            $categories_list
        );
    	
    	$tags_list = get_the_tag_list( '', _x( ', ', 'Used between list items, there is a space after the comma.', 'generatepress' ) );
    	$tags_list = sprintf( '<span class="tags-links"><span class="screen-reader-text">%1$s </span>%2$s</span>',
    		_x( 'Tags', 'Used before tag names.', 'generatepress' ),
    		$tags_list
    	);
    
      echo $output . $categories_list . ' | ' . $tags_list;
    
    }
Viewing 15 posts - 1 through 15 (of 17 total)
  • You must be logged in to reply to this topic.