[Support request] Tags are not showing in the pages

Home Forums Support [Support request] Tags are not showing in the pages

Home Forums Support Tags are not showing in the pages

Viewing 15 posts - 16 through 30 (of 32 total)
  • Author
    Posts
  • #2401869
    David
    Staff
    Customer Support

    Add this CSS to unhide the icon:

    .entry-header .entry-meta .gp-icon {
        display: inline;
    }
    #2402099
    Oppo Gene

    One last thing related tags, can I show different tags of current post, with separate gp tag icon of each tag? If so, can you also share CSS regarding this.

    (Screenshot)
    https://postimg.cc/9DszNgRZ
    https://postimg.cc/2brkPszb

    #2402130
    Oppo Gene

    Also please tell through which typography or other option should I edit the tags fonts and icon colour

    #2402456
    David
    Staff
    Customer Support

    Just so i am clear, if you had 3 tags, you want each of them to have their own specific icon ?

    Typography:

    1. Customizer > Typography +-> New Typography
    2. Select the Custom element and add: entry-meta in the CSS field.
    3. Set your typography styles

    Color:

    1. Customizer > Colors
    2. Set the Entry Meta and Entry Meta Link colors

    #2403001
    Oppo Gene

    Just so i am clear, if you had 3 tags, you want each of them to have their own specific icon ?

    Yes.

    #2403414
    David
    Staff
    Customer Support

    OK, seeing as you have Font Awesome loading on your site. You can use its icons.
    For each icon you will need to get its Unicode which can be found here:

    https://fontawesome.com/search

    When you select an Icon and click copy Unicode you will get something like: f001
    Add a back slash to that eg. \f001

    Now we write some generic CSS to prepare each tag link to have its own icon:

    
    .tags-links a[rel="tag"]:before {
        content: '';
        font-size: 18px;
        font-family: "Font Awesome 5 Free";
        margin-right: 5px
    }

    Then you need a specific CSS rule for each tag.
    To target each tag we will look for the tag slug in the href. For example the latest tag:

    
    .tags-links a[rel="tag"][href*="latest"]:before {
        content: '\f001';
    }

    Just create a new rule for each tag, and swap the \f001 unicode for your icon.

    #2403470
    Oppo Gene

    Hi David I have used this

    .tags-links a[rel=”tag”][href*=”latest”]:before {
    content: ‘\f001’;
    }

    Its shows an icon before tag, (screenshot Icontag), but its not the thing I want theme tag icon to appear before every tag as shown in screenshot (Icontag2).

    https://postimg.cc/Cz0q7BbN (Icontag)
    https://postimg.cc/BjLPQT3J (Icontag2) Required

    #2404067
    Fernando
    Customer Support

    Hi Hassnain,

    To clarify, are you wanting to add unique icons to each tag?

    Or, are you wanting to replace to icon your referred to in Icontag2?

    If you can provide an example, that would be great as well.

    Let us know.

    #2404159
    Oppo Gene

    Hi, I don’t want to replace the theme icon tag.

    (Example)

    Current settings: Theme Tag Icon – Tag. (If I create more tags in the current post, it would be) Theme Tag Icon – Tag, Tag, Tag

    Required settings: Theme Tag Icon – Tag, Tag Icon – Tag, Tag Icon – Tag (every tag will show it’s Icon Tag, before it)

    I Hope this will clear you what I wanted for tags

    #2404181
    Fernando
    Customer Support

    I see. The codes provided by David should do just that for Fontawesome.

    Can you try these?:

    .tags-links a[rel="tag"]:before {
        content: '';
        font-size: 18px;
        font-family: "Font Awesome 5 Free"
        margin-right: 5px;
        font-weight: 900;
    }
    
    .tags-links a[rel="tag"][href*="latest"]:before {
        content: '\f555 - ';
    }
    
    .tags-links a[rel="tag"][href*="x5"]:before {
        content: '\f007 - ';
    }
    #2404406
    Oppo Gene

    again you didn’t get it. I want .gp-icon svg, to appear before every tag. Inspect GP ICON SVG, on the given page “https://opporingtones.com/download/download-realme-narzo-50i-prime-default-ringtone/” the image of icon is also shared in screenshot

    https://postimg.cc/ctLtTXmq

    #2404620
    David
    Staff
    Customer Support

    1. Remove this CSS:

    .entry-header .entry-meta .gp-icon {
        display: inline;
    }

    And remove any other CSS you added for the other icons.

    2. Add this CSS:

    
    .tags-links a[rel="tag"]:before {
        content: '\f02c';
        font-size: 18px;
        font-family: "Font Awesome 5 Free";
        margin-right: 5px;
        font-weight: 900;
    }
    #2405780
    Oppo Gene

    Hi David, Thanks, it’s done finally. I am trying to do such on my another website, but it is not showing after GP Premium Plugin and the code you shared last.

    I have checked it theme functions file, the code I found on Oppo After Updating the Premium Version is:
    add_filter(‘term_links-post_tag’,’limit_to_five_tags’);
    function limit_to_five_tags($terms) {
    return array_slice($terms,0,5,true);
    }

    This filter is not showing in Theme Function File I have add it manually and others snippets that you have shared with me. Nothing is working on it

    and some other snippet that you have guide me like:
    .entry-header .entry-meta .gp-icon {
    display: inline;
    }

    Can you check it once that why anything is not working on it

    Website: Tonesmp3.Ca

    Thank You
    Looking Forward

    #2406013
    Oppo Gene
    #2406023
    David
    Staff
    Customer Support
Viewing 15 posts - 16 through 30 (of 32 total)
  • You must be logged in to reply to this topic.