Hello! I'm currently developing my blog and I've customized the color of each category (see attached image for example)...however, I'm getting mixed results with the category colors actually displaying on my blog.
For example, the "Career & Freelancing" color is customized to yellow...but on the blog, it displays as a blue color. On the other hand, the "Instructional Design" category is customized to pink, and it is displaying correctly on the blog. In fact, this error is true for all of the category colors, except for the Instructional Design category - they aren't showing the custom color on the blog
I'm not sure if it's user error on my end OR if there's something not right. Any help would be great. THANKS!
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
Hello! I'm currently developing my blog and I've customized the color of each category (see attached image for example)...however, I'm getting mixed results with the category colors actually displaying on my blog.
For example, the "Career & Freelancing" color is customized to yellow...but on the blog, it displays as a blue color. On the other hand, the "Instructional Design" category is customized to pink, and it is displaying correctly on the blog. In fact, this error is true for all of the category colors, except for the Instructional Design category - they aren't showing the custom color on the blog
I'm not sure if it's user error on my end OR if there's something not right. Any help would be great. THANKS!
Tim
Hey Again,
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
[data-style="list_featured_first_row"] .meta-category .instructional-design, .masonry.material .masonry-blog-item .meta-category .instructional-design, .post-area.featured_img_left .meta-category .instructional-design, .related-posts[data-style="material"] .meta-category .instructional-design { color: #f8a551 !important; } .single .heading-title[data-header-style="default_minimal"] .meta-category .instructional-design:hover, .single .heading-title[data-header-style="default_minimal"] .meta-category .instructional-design:focus, body.material #page-header-bg.fullscreen-header .inner-wrap >a.instructional-design, .blog-recent.related-posts[data-style="classic_enhanced"] .meta-category .instructional-design:hover, .masonry.classic_enhanced .posts-container article .meta-category .instructional-design:hover, .blog-recent.related-posts[data-style="classic_enhanced"] .meta-category .instructional-design:focus, .masonry.classic_enhanced .posts-container article .meta-category .instructional-design:focus, #page-header-bg[data-post-hs="default_minimal"] .inner-wrap > .instructional-design:hover, #page-header-bg[data-post-hs="default_minimal"] .inner-wrap > .instructional-design:focus, .nectar-recent-posts-slider .container .strong .instructional-design:before, .masonry.material .masonry-blog-item .meta-category .instructional-design:before, [data-style="list_featured_first_row"] .meta-category .instructional-design:before, .nectar-recent-posts-single_featured .strong .instructional-design, .related-posts[data-style="material"] .meta-category .instructional-design:before, .post-area.featured_img_left .meta-category .instructional-design:before, .post-area.featured_img_left .quote.category-instructional-design .quote-inner:before, .material.masonry .masonry-blog-item.category-instructional-design .quote-inner:before, .material.masonry .masonry-blog-item.category-instructional-design .video-play-button, .material.masonry .masonry-blog-item.category-instructional-design .link-inner:before { background-color: #f8a551 !important; }Thanks
ThemeNectar Support Team