Archived topic
Adding "Last Updated" CSS to one page only
7 replies · Started by gamboool on November 13, 2021
Hi, and sorry if this is a dumb question regarding adding "update post" CSS.
I've installed the Simple CSS plug-in and would like to add an "Updated post" date to one page only. (A price sensitive page that I update monthly).
I read the recommended CSS instructions from from Generate Press here: https://docs.generatepress.com/article/show-the-updated-post-date/
My question: Do I have enter CSS into the editor in the Dashboard first? In other words, can I just add CSS to one page only? And if I do add the recommended CSS into the dashboard editor, will it show "Updated post" for every page on my site?
Thank you for helping me.
-Steve
Hi Steve,
If you only want to apply the CSS to a certain page, then add the CSS in the Simple CSS field of the page editor.
Don't add it to customizer > simple CSS or customizer > additional CSS.
Thank you Ying. Just to be clear: I don't have to have to add any CSS in the dashboard editor first? I ask because I tried the following code from GeneratePress below on one page, and it didn't seem to work (I cached the page afterwards).
.posted-on .updated {
display: inline-block;
}
.posted-on .updated + .entry-date {
display: none;
}
Also, do I have to type in the date? Or does it do it automatically?
Lastly, I don't know if this matters, but I'm trying to show this "Updated" date on a page and not a post. The page in question is here: https://gamboool.com/circus-circus-buffet-prices-and-hours
Thank you for your patience with me Ying.
Ah I see, pages don't have post meta built in, so you'll need to add the post meta to the page first:
1. Go to appearance > elements, create a new Hook element.
2. Add this code into the hook element: <?php generate_posted_on(); ?>, tick theExecute PHPbox, choose generate_before_content
hook, please refer to this screenshot: https://www.screencast.com/t/EJo15bJDwq6
3. Choose page > the specific page as location: https://www.screencast.com/t/e9FqIX715BF
Then add this CSS to the simple CSS field in the page editor or to customizer > additional CSS/simple CSS
.page .posted-on .updated {
display: inline-block;
}
.page .posted-on .updated + .entry-date , .page .byline{
display: none;
}
Also, do I have to type in the date? Or does it do it automatically?
No, you don't need to. The date will be generated automatically.
Let me know if this helps :)
Thank you so much for your detailed response Ying. You're earning your keep with me:)
Unfortunately, I have the message, "Unable to execute PHP as DISALLOW_FILE_EDIT is defined."
I'm currently reading up on how to correct this. I know GP has a lot of documentation on this; I'm just leery of accidently deleting my site when getting into the FTP files.
I'll let you know.
Thank you again.
-Steve
Hi there,
this document provides a PHP Snippet:
https://docs.generatepress.com/article/generate_hooks_execute_php/
You can add this to a) Child Theme functions.php or b) the Code Snippets plugin.
It will enable PHP editing just inside the GP Hooks
Dear David and Ying,
You guys are incredible. Thank you so much for helping this noob out. I've tested on a page and it works great. '
One last dumb question if you have time:
How do I add the words, "Last updated on" before the date? I can fiddle with CSS to make the font smaller but I'm unsure as to how to add this.
Thank you again for your assistance. I really appreciate it.
You can add this CSS as well :)
.posted-on .updated:before {
content: "Last updated on ";
}
Glad to help!