Archived topic
I cannot turn off the "display read more as button"
12 replies · Started by Bob on July 4, 2021
I have looked high and low, and for some odd reason when I toggle off the "display read more as button" it stays there on the archive page. I also tried a piece of CSS that I found in another thread to move it to the right, and it doesn't work as well.
Of course I can removed the background via the button background, but that is global and affects all buttons.
Not sure if I have something else going on that I did in the past that is doing this? url is https://dothewoo.io
thanks!
Nevermind found the culprit.
Glad to hear :)
I lied, one thing led to another hah. So after solving the button issue, now adding some CSS is not working
.read-more-container {
margin-top: 10px;
text-align: right;
}
Do I have this wrong? Thanks!
Hi Bob,
This CSS should work, I just tested it in the dev tool:
https://www.screencast.com/t/f5kxn6vcc
Does it work in customizer when you add the CSS to addtional CSS?
Let me know :)
Hi Ying, yeah, when I put it in there nothing happens. I looked through my CSS (I am not the best at this) and any snippets to make sure something wasn't conflicting. I did earlier add this snippet to my site suggested here as my "read more" wasn't showing up .
add_action( 'generate_after_entry_content', 'tu_static_read_more_button' );
function tu_static_read_more_button() {
?>
<p class="read-more-container">
" ">Read more
</p>
<?php
}
on this I removed the class as instructed to get rid of the button as it wasn't working with the toggle off and on in the customizer... if that makes sense :) not sure if I screwed up something there...
Hi Bob,
Have you sorted this out? I've checked your blog page and the read more doesn't appear as a button anymore as shown here -
https://share.getcloudapp.com/8LuoY0QG
If it's still showing as a button on your end, try clearing your browser cache. :)
Let us know if you need further help. :D
Yeah, button is gone, but for some reason I cannot get either the right justify or the space above the "read more" to increase with this:
.read-more-container {
margin-top: 10px;
text-align: right;
}
The CSS looks good.
I'd recommend running all of your CSS through an error checker using a service like this to make sure there isn't a syntax error that stops the CSS below the error from executing:
https://jigsaw.w3.org/css-validator/
Yeah, checks out fine.. not sure what is going on... oh well
Are you sure?
I just ran your CSS in Additional CSS through the checker and it's showing this error:
https://www.screencast.com/t/KuvhplASAxY
Looks like you are missing closing bracket }:
https://www.screencast.com/t/4flKYnfzGayU
Ahh, man, I am so stupid.. just ran the check on that one. Duh. Now you know why I ask people much smarter than me LOL. Thanks so much I am good to go!!
I always use the direct input option:
https://jigsaw.w3.org/css-validator/#validate_by_input
Then you can just copy all of your CSS in there at once and it will tell you if it has any issues or not :)