- This topic has 31 replies, 3 voices, and was last updated 1 year, 4 months ago by David.
-
AuthorPosts
-
November 4, 2022 at 9:35 am #2401869DavidStaffCustomer Support
Add this CSS to unhide the icon:
.entry-header .entry-meta .gp-icon { display: inline; }
November 4, 2022 at 1:45 pm #2402099Oppo GeneOne 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/2brkPszbNovember 4, 2022 at 2:25 pm #2402130Oppo GeneAlso please tell through which typography or other option should I edit the tags fonts and icon colour
November 5, 2022 at 3:45 am #2402456DavidStaffCustomer SupportJust 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 stylesColor:
1. Customizer > Colors
2. Set the Entry Meta and Entry Meta Link colorsNovember 5, 2022 at 12:08 pm #2403001Oppo GeneJust so i am clear, if you had 3 tags, you want each of them to have their own specific icon ?
Yes.
November 6, 2022 at 4:35 am #2403414DavidStaffCustomer SupportOK, 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 thelatest
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.November 6, 2022 at 5:37 am #2403470Oppo GeneHi 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) RequiredNovember 6, 2022 at 5:52 pm #2404067Fernando Customer SupportHi 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.
November 6, 2022 at 10:13 pm #2404159Oppo GeneHi, 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
November 6, 2022 at 10:50 pm #2404181Fernando Customer SupportI 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 - '; }
November 7, 2022 at 1:23 am #2404406Oppo Geneagain 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
November 7, 2022 at 4:46 am #2404620DavidStaffCustomer Support1. 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; }
November 7, 2022 at 11:11 pm #2405780Oppo GeneHi 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 ForwardNovember 8, 2022 at 4:04 am #2406013Oppo GeneNovember 8, 2022 at 4:15 am #2406023DavidStaffCustomer SupportYou need the snippet from here:
https://generatepress.com/forums/topic/tags-are-not-showing-in-the-pages/#post-2401433
-
AuthorPosts
- You must be logged in to reply to this topic.