twigsplace Posted March 21 Share Posted March 21 Site URL: www.twigsbranchphotography.com Page url: https://www.twigsbranchphotography.com/shropshire-photography-blog I want to add a title to my blog's landing page but as I can't add blocks I think I need custom code to add it in. How can I do that please? I am using a Mint template on 7.0 and have very little tech knowledge so please bear with me! Link to comment
tuanphan Posted March 25 Share Posted March 25 You mean add a Site Title above Blog Image or? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
twigsplace Posted March 25 Author Share Posted March 25 3 hours ago, tuanphan said: You mean add a Site Title above Blog Image or? Hi @tuanphan - I want to add some text content at top of my blog landing page as an introduction, before the list of blogs. But as I'm on 7.0 I don't seem to be able to add content blocks the usual way on this page? Link to comment
tuanphan Posted March 27 Share Posted March 27 On 3/25/2024 at 6:57 PM, twigsplace said: Hi @tuanphan - I want to add some text content at top of my blog landing page as an introduction, before the list of blogs. But as I'm on 7.0 I don't seem to be able to add content blocks the usual way on this page? I see you solved by using Summary Block? If you still need help, just share link to a blog page, I can give you some CSS code to add text Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
twigsplace Posted March 27 Author Share Posted March 27 9 hours ago, tuanphan said: I see you solved by using Summary Block? If you still need help, just share link to a blog page, I can give you some CSS code to add text Hey @tuanphan - yes I created a new content page and added the blog as a summary block, then moved the original blog to the unlinked section - no idea if this is a good idea though? Or would it be better to add text to the original blog page and delete the summary page version? The URL of the original blog is: www.twigsbranchphotography.com/shropshire-photography-blogs Many thanks! Link to comment
Solution tuanphan Posted March 29 Solution Share Posted March 29 On 3/28/2024 at 12:27 AM, twigsplace said: Hey @tuanphan - yes I created a new content page and added the blog as a summary block, then moved the original blog to the unlinked section - no idea if this is a good idea though? Or would it be better to add text to the original blog page and delete the summary page version? The URL of the original blog is: www.twigsbranchphotography.com/shropshire-photography-blogs Many thanks! Use standard page with Summary Block, you can adjust layout easier (add text, banner, any blocks to this page) yasabu_jemi40 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
WilsonTSmith Posted April 9 Share Posted April 9 Hello - I wanted to follow up on this original request. I'm in a similar position as the original poster, but am looking for something that works directly on the blog page as an introduction to the blog, rather than a separate summary page. The idea would be to have a small paragraph above the most recent blog post. I've found some other threads sharing CSS solutions, but none seem to quite align with what I'm looking for. I'm on 7.0, Om template in the Montauk family. Here's a link to the blog itself: https://wilsontannersmith.com/hcs-iii This intro paragraph would sit just before the main blog body, so above the "Misc. Videos" title there, but below all the site navigation. (of course the blog area itself would move down a little to accommodate the extra text). Thanks! Link to comment
tuanphan Posted April 13 Share Posted April 13 On 4/9/2024 at 4:30 PM, WilsonTSmith said: Hello - I wanted to follow up on this original request. I'm in a similar position as the original poster, but am looking for something that works directly on the blog page as an introduction to the blog, rather than a separate summary page. The idea would be to have a small paragraph above the most recent blog post. I've found some other threads sharing CSS solutions, but none seem to quite align with what I'm looking for. I'm on 7.0, Om template in the Montauk family. Here's a link to the blog itself: https://wilsontannersmith.com/hcs-iii This intro paragraph would sit just before the main blog body, so above the "Misc. Videos" title there, but below all the site navigation. (of course the blog area itself would move down a little to accommodate the extra text). Thanks! You can use this code to Website > Website Tools > Custom CSS body#collection-5ecc68a1e3d0ce7bf222b572 h1.entry-title:after { content: "enter your text here enter your text here"; display: block; font-size: 16px; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
Manu67 Posted April 15 Share Posted April 15 Hi, I've got the same question on how to add a small introduction to the blog page itself. I guess this code could answer but the "5ecc68a1e3d0ce7bf222b572" key seems to be personnal. Our web site : digitalsace.fr Many thanks in advance body#collection-5ecc68a1e3d0ce7bf222b572 h1.entry-title:after { content: "enter your text here enter your text here"; display: block; font-size: 16px; } lesu-wacosi75 1 Link to comment
tuanphan Posted April 18 Share Posted April 18 On 4/15/2024 at 7:03 PM, Manu67 said: Hi, I've got the same question on how to add a small introduction to the blog page itself. I guess this code could answer but the "5ecc68a1e3d0ce7bf222b572" key seems to be personnal. Our web site : digitalsace.fr Many thanks in advance body#collection-5ecc68a1e3d0ce7bf222b572 h1.entry-title:after { content: "enter your text here enter your text here"; display: block; font-size: 16px; } You mean blog list page or blog post detail? If list page, use this CSS code body#collection-5f5f773ef54b1d692851fe70 h1.blog-title:after { content: "enter your text here enter your text here"; display: block; font-size: 16px; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
Manu67 Posted April 18 Share Posted April 18 Hi TuanPhan, Thanks for your reply. I do this but nothing happend : What's the Matter? Link to comment
WilsonTSmith Posted April 19 Share Posted April 19 On 4/13/2024 at 9:50 AM, tuanphan said: You can use this code to Website > Website Tools > Custom CSS body#collection-5ecc68a1e3d0ce7bf222b572 h1.entry-title:after { content: "enter your text here enter your text here"; display: block; font-size: 16px; } Thanks for the reply! I'm looking for a header that would sit above any most recent blog post, such that it would serve as a header to the entire blog, rather than sit under the title of a given post as "Misc. Videos" is . Sorry if that was unclear! Is there a different CSS code I could use for that? Thank you! Link to comment
tuanphan Posted April 22 Share Posted April 22 On 4/18/2024 at 5:51 PM, Manu67 said: Hi TuanPhan, Thanks for your reply. I do this but nothing happend : What's the Matter? Your screenshot is Page Header Code Injection, to add code to this position, you need to use this new code <style> h1.entry-title:after { content: "enter your text here enter your text here"; display: block; font-size: 16px; } </style> On 4/20/2024 at 3:36 AM, WilsonTSmith said: Thanks for the reply! I'm looking for a header that would sit above any most recent blog post, such that it would serve as a header to the entire blog, rather than sit under the title of a given post as "Misc. Videos" is . Sorry if that was unclear! Is there a different CSS code I could use for that? Thank you! You mean add text to this position? Manu67 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
Manu67 Posted April 22 Share Posted April 22 TuanPhan I tried this but nothing happend : Link to comment
WilsonTSmith Posted April 24 Share Posted April 24 On 4/22/2024 at 11:21 AM, tuanphan said: Your screenshot is Page Header Code Injection, to add code to this position, you need to use this new code <style> h1.entry-title:after { content: "enter your text here enter your text here"; display: block; font-size: 16px; } </style> You mean add text to this position? Yes, that screenshot location is correct - the idea is that the header text would be independent of the blog posts. Previously I was using a template which allowed this, but it seems the template I'm currently using does not. Link to comment
tuanphan Posted April 26 Share Posted April 26 On 4/22/2024 at 7:24 PM, Manu67 said: TuanPhan I tried this but nothing happend : I see you edited my code, there is space here space will make id invalid, my code has no space Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
tuanphan Posted April 26 Share Posted April 26 On 4/24/2024 at 5:32 PM, WilsonTSmith said: Yes, that screenshot location is correct - the idea is that the header text would be independent of the blog posts. Previously I was using a template which allowed this, but it seems the template I'm currently using does not. So did you code work or you still need help? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
tuanphan Posted April 28 Share Posted April 28 On 4/26/2024 at 5:22 PM, Manu67 said: Hi TuanPhan, Thans for your help The code makes appear a "subtile" for each post. That's not exactly what I want. I would like to get a Title for the global main blog page (digitalsace.fr/blog) You can use this code to Custom CSS body.view-list [data-section-id="61b9bb53963c00104414e46f"] .content-wrapper .content:before { content: "abcxzy 1 2 3 4 5"; text-align:center; position: absolute; left: 50%; transform: translateX(-50%); top: 0; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
tuanphan Posted April 30 Share Posted April 30 On 4/29/2024 at 2:43 AM, Manu67 said: Hi Tuan Phan, Thanks again for your help. We are on the right way, as I can with this code add a "title" on the blog home page. But, this title is going on blog tags, especially on smartphones. Is there a way to make tags disappear for example or another workaround ? Thanks in advance, Emmanuel You can use this new code body.view-list [data-section-id="61b9bb53963c00104414e46f"] .content-wrapper .content:before { content: "What do they got in there? King Kong? Hey, you know how I'm, like, always trying to save the planet?"; text-align:center; position: absolute; left: 50%; transform: translateX(-50%); top: 0; } @media screen and (max-width:767px) { body.view-list [data-section-id="61b9bb53963c00104414e46f"] .content-wrapper .content:before { display: none; } body.view-list [data-section-id="61b9bb53963c00104414e46f"] div#block-yui_3_17_2_1_1639562063313_3002:before { content: "What do they got in there? King Kong? Hey, you know how I'm, like, always trying to save the planet?"; text-align:center; margin-bottom: 30px; display: block; } } Manu67 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
WilsonTSmith Posted May 1 Share Posted May 1 On 4/26/2024 at 10:26 AM, tuanphan said: So did you code work or you still need help? Hello, Sorry no it didn't - that code snippet I tried only placed it "within" the blog post's body itself, not as a header for the entire blog like the screenshot you shared. Link to comment
Manu67 Posted May 2 Share Posted May 2 On 4/30/2024 at 10:32 AM, tuanphan said: You can use this new code body.view-list [data-section-id="61b9bb53963c00104414e46f"] .content-wrapper .content:before { content: "What do they got in there? King Kong? Hey, you know how I'm, like, always trying to save the planet?"; text-align:center; position: absolute; left: 50%; transform: translateX(-50%); top: 0; } @media screen and (max-width:767px) { body.view-list [data-section-id="61b9bb53963c00104414e46f"] .content-wrapper .content:before { display: none; } body.view-list [data-section-id="61b9bb53963c00104414e46f"] div#block-yui_3_17_2_1_1639562063313_3002:before { content: "What do they got in there? King Kong? Hey, you know how I'm, like, always trying to save the planet?"; text-align:center; margin-bottom: 30px; display: block; } } Hi TuanPhan GREAT. Thanks a lot. Just a small thing : is it possible to make it bigger (H1 or H2 for example) ? Link to comment
tuanphan Posted May 4 Share Posted May 4 On 5/2/2024 at 11:27 PM, Manu67 said: Hi TuanPhan GREAT. Thanks a lot. Just a small thing : is it possible to make it bigger (H1 or H2 for example) ? You can use font-size to the code body.view-list [data-section-id="61b9bb53963c00104414e46f"] .content-wrapper .content:before { content: "What do they got in there? King Kong? Hey, you know how I'm, like, always trying to save the planet?"; text-align:center; position: absolute; left: 50%; transform: translateX(-50%); top: 0; font-size: 30px; } @media screen and (max-width:767px) { body.view-list [data-section-id="61b9bb53963c00104414e46f"] .content-wrapper .content:before { display: none; } body.view-list [data-section-id="61b9bb53963c00104414e46f"] div#block-yui_3_17_2_1_1639562063313_3002:before { content: "What do they got in there? King Kong? Hey, you know how I'm, like, always trying to save the planet?"; text-align:center; margin-bottom: 30px; display: block; font-size: 20px; } } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
tuanphan Posted May 4 Share Posted May 4 On 5/1/2024 at 10:16 PM, WilsonTSmith said: Hello, Sorry no it didn't - that code snippet I tried only placed it "within" the blog post's body itself, not as a header for the entire blog like the screenshot you shared. I see it already show fine here https://wilsontannersmith.com/hcs-iii Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
WilsonTSmith Posted May 10 Share Posted May 10 On 5/4/2024 at 12:01 PM, tuanphan said: I see it already show fine here Yeah, I actually don't know how/why that changed! But unfortunately now it's present before every blog post, not just the first landing page -- is there a way to only get one as a page header, but not on each post? Thanks for all your help! Link to comment
tuanphan Posted May 12 Share Posted May 12 On 5/10/2024 at 3:39 PM, WilsonTSmith said: Yeah, I actually don't know how/why that changed! But unfortunately now it's present before every blog post, not just the first landing page -- is there a way to only get one as a page header, but not on each post? Thanks for all your help! Remove this code from Page Header or Code Injection and add this new code to Website > Website Tools > Custom CSS body#collection-5ecc68a1e3d0ce7bf222b572 h1.entry-title:before { content: "After his sudden passing in May 2013, I’ve been occasionally collecting stories and (re)discovering the dance/theatre work of my father, Henry Clay Smith, and his company Solaris Dance-Theatre. Intermingled are my own stories and reflections on/through grief."; display: block; font-size: 16px; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment