-
AuthorPosts
-
June 28, 2016 at 1:06 am #654011
Can I change the color and font size in the “Title and Excerpt + Read More Link” in blog posts? I am hoping some code can be added in the Quick CSS.
I would like the color of “Read More” to be red #ca0003 and the font size to increase by 2 pixels.
Thanks,
KurtJune 30, 2016 at 11:45 am #655218Hey Kurt,
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:
.post-entry h1 strong{ color: #85b6e8!important; } .post-entry p{ color: #999!important; }
Best regards,
VinayJune 30, 2016 at 3:05 pm #655298Unfortunately, this did not work. I added the code into the Quick CSS and it changed some of the body text (making some of the type bold). It does not change the “Read more →” items in the blog posts on the home (index) page.
Any suggestions?
Thanks,
KurtJune 30, 2016 at 6:20 pm #655412Hi,
I have added the code in Quick CSs for testing purpose and it works as intended to. Please check the attached screenshot.
You may not see the changes until the cached files are cleared in your browser. Please try to hard refresh by pressing Ctrl + Shift + F5 on your browser or press the F12 key to open chrome dev tools and right click on the refresh button and select “Empty Cache and Hard Reload” and review the site again.
Best regards,
VinayJune 30, 2016 at 8:05 pm #655455Vinay:
Please look at the items under that area from the screen grab. The area is entitled “Other stories on Your SOURCE…” Under each item, there is “Read more →”, referring users to click the link to see the full post. It is part of a blog post. The above items (you have in the frame grab) are text boxes. I don’t want to change that stuff.
I would like to see if there is Quick CSS code to make the “Read more →” items be in color and the font larger.
Can this be done. If not, no problem.
Thanks,
KurtJuly 4, 2016 at 6:34 am #656392Hi,
Thank you for the info. Please use this css code:
.main_color .more-link { color: red !important; font-size: 20px; }
Adjust the value as needed.
Best regards,
IsmaelJuly 4, 2016 at 2:49 pm #656598Ismael:
This is just what I want. Thank you.
One more thing, if I wanted to have reverse type, so the background would be red and the type white, what would the CSS code be?
Thanks,
KurtJuly 5, 2016 at 8:40 am #656883Hi Kurt,
For the same element it would be something like this:
.main_color .more-link { color: white !important; background: red !important; }
Regards,
RikardJuly 5, 2016 at 5:23 pm #657166Rikard:
This is great.
How can I put padding around the right and left?
Thanks,
KurtJuly 6, 2016 at 3:12 pm #657509Hi Kurt,
Please add this line:
padding: auto 10px;
The auto argument applies to top and bottom, the 10px argument applies to left and right.
Thanks,
RikardJuly 6, 2016 at 3:53 pm #657532I made this change, but it did not work:
.main_color .more-link {
color: white !important;
background: #ca0003 !important;
padding: auto 10px;
}Suggestions?
July 6, 2016 at 5:24 pm #657632Hi,
would be best to use a new ticket for a different question/issue, otherwise it gets very confusing here.
“auto” value for padding does not work, so insert a number instead. Other values are working for me. Clear browser cache and hard refresh a few times.
Best regards,
AndyJuly 6, 2016 at 6:20 pm #657657Changing the “auto” value to a number worked. Thanks for y;our help.
I apologize that I did not open a different ticket and caused confusion. I will not do this in the future.
You can now close this ticket. Thanks again.
KurtJuly 7, 2016 at 12:10 pm #657927Hi,
glad we could help. Let us know in a new ticket if you have some more questions related to the theme. We are happy to assist you.
Best regards,
Andy -
AuthorPosts
- The topic ‘Change color and font size for Read More’ is closed to new replies.