ferguswood Posted January 17, 2022 Share Posted January 17, 2022 8 hours ago, tuanphan said: Add text only or clickable-text? Can you share link to your site? Clickable text please - https://caminodelvino.co.uk/ Link to comment
tuanphan Posted January 20, 2022 Share Posted January 20, 2022 On 1/17/2022 at 3:06 PM, ferguswood said: Clickable text please - https://caminodelvino.co.uk/ Thank you. Sorry for delay. I clicked on link & it redirects to product page. Which position on product page do you want to add a 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
ferguswood Posted January 24, 2022 Share Posted January 24, 2022 On 1/20/2022 at 11:01 PM, tuanphan said: Thank you. Sorry for delay. I clicked on link & it redirects to product page. Which position on product page do you want to add a text? Hmm that's weird, should've been my homepage - https://caminodelvino.co.uk - apologies about this! Link to comment
tuanphan Posted January 24, 2022 Share Posted January 24, 2022 4 hours ago, ferguswood said: Hmm that's weird, should've been my homepage - https://caminodelvino.co.uk - apologies about this! Which position you want to add a clickable text on homepage? 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
Mary_DG Posted April 19, 2022 Share Posted April 19, 2022 Hello, we wanted to have the menu below an image gallery (for homepage only) with links so I added a menu block and removed the actual menu buttons. But now, it looks pretty bad on mobile and i have to update every single page of any new menu button that needs to be added. Is there a CSS code that you can share to move the menu buttons below the gallery for the homepage only. The menu bar can stay on top for the other pages. Really appreciate this. Link to comment
cameronjaisun Posted May 16, 2022 Share Posted May 16, 2022 Hello I was wondering if there is a script/code to move the menu bar to the side like this website. https://www.willemverbeeck.com/ Thanks! Link to comment
tuanphan Posted May 20, 2022 Share Posted May 20, 2022 On 4/20/2022 at 1:01 AM, Mary_DG said: Hello, we wanted to have the menu below an image gallery (for homepage only) with links so I added a menu block and removed the actual menu buttons. But now, it looks pretty bad on mobile and i have to update every single page of any new menu button that needs to be added. Is there a CSS code that you can share to move the menu buttons below the gallery for the homepage only. The menu bar can stay on top for the other pages. Really appreciate this. Sorry. Missing your comment. Have you solved it yet? On 5/16/2022 at 1:18 PM, cameronjaisun said: Hello I was wondering if there is a script/code to move the menu bar to the side like this website. https://www.willemverbeeck.com/ Thanks! Can you share link to your site? We can check easier 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
Mary_DG Posted June 6, 2022 Share Posted June 6, 2022 Hello tuanphan, no I have reverted to using the menu buttons for other pages and hid it on the homepage and continued to use Block Menu. Problem I am facing now is responsiveness of the text in different screensizes. website: https://www.formebar.com/ Link to comment
tuanphan Posted June 10, 2022 Share Posted June 10, 2022 On 6/6/2022 at 11:57 PM, Mary_DG said: Hello tuanphan, no I have reverted to using the menu buttons for other pages and hid it on the homepage and continued to use Block Menu. Problem I am facing now is responsiveness of the text in different screensizes. website: https://www.formebar.com/ You can consider using Text Block with bullet list, then we can target it easier with CSS to adjust responsive 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
jesswp Posted June 10, 2022 Share Posted June 10, 2022 Hi there @tuanphan @bangank36, Got a little lost in this thread. I am trying to implement something similar for a client's site where the header nav is below the hero banner JUST for the home page. Is this doable? https://collie-blue-teb7.squarespace.com/homeattached image for what I'm trying to achieve. Ideally Id like to keep the scroll action where the logo is smaller when scrolling. Thank you for your time and attention. Link to comment
tuanphan Posted June 12, 2022 Share Posted June 12, 2022 On 6/11/2022 at 5:43 AM, jesswp said: Hi there @tuanphan @bangank36, Got a little lost in this thread. I am trying to implement something similar for a client's site where the header nav is below the hero banner JUST for the home page. Is this doable? https://collie-blue-teb7.squarespace.com/homeattached image for what I'm trying to achieve. Ideally Id like to keep the scroll action where the logo is smaller when scrolling. Thank you for your time and attention. You mean Header under banner (homepage only) Keep header sticky to top on scroll? Is this right? 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
jesswp Posted June 13, 2022 Share Posted June 13, 2022 2 hours ago, tuanphan said: You mean Header under banner (homepage only) Keep header sticky to top on scroll? Is this right? Yes. Essentially how I have everything right now just moving the nav header under banner on home page. Id still like the header logo to shrink as they scroll. Thanks! Link to comment
katiedunnit Posted June 29, 2022 Share Posted June 29, 2022 Looking for the same @tuanphan! Just I can't make the above nav a coded image, it should just sit below the first section. Looks like jesswp needs the same thing. 🙂 Link to comment
tuanphan Posted June 30, 2022 Share Posted June 30, 2022 On 6/13/2022 at 8:52 AM, jesswp said: Yes. Essentially how I have everything right now just moving the nav header under banner on home page. Id still like the header logo to shrink as they scroll. Thanks! Try adding to Code Injection > Footer <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://d1j8mu9lowy9zf.cloudfront.net/twcsl/0.2.2/twcsl.js"></script> <script> document.addEventListener("DOMContentLoaded",function() { const header = document.getElementById('header'); const firstSection = document.querySelector('.page-section:first-child'); firstSection.after(header); }); </script> <style> @media screen and (min-width: 768px) { #header { position: sticky; top: 0; display: none; } main .page-section:first-child + #header { display: block; } main .page-section:first-child { min-height: calc(100vh - 93px)!important; } } </style> 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
SummerLange Posted July 12, 2022 Share Posted July 12, 2022 Hi! I have the 7.0 version and would like to move my navigation under my fixed header. For some reason it's sitting on top of it. And then I'd like for the header to show up on mobile as well.... here's my site https://www.summerlangephotography.com/ Link to comment
SummerLange Posted July 12, 2022 Share Posted July 12, 2022 31 minutes ago, SummerLange said: Hi! I have the 7.0 version and would like to move my navigation under my fixed header. For some reason it's sitting on top of it. And then I'd like for the header to show up on mobile as well.... here's my site https://www.summerlangephotography.com/ I also forgot to add that my header is covering my first gallery. How do I fix it to where the gallery isn't cut off? Link to comment
tuanphan Posted July 13, 2022 Share Posted July 13, 2022 (edited) 17 hours ago, SummerLange said: Hi! I have the 7.0 version and would like to move my navigation under my fixed header. For some reason it's sitting on top of it. And then I'd like for the header to show up on mobile as well.... here's my site https://www.summerlangephotography.com/ Move nav under header, or move nav under slideshow or move header under slideshow?? Edited July 13, 2022 by tuanphan 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
KopeStudio Posted April 25, 2023 Share Posted April 25, 2023 (edited) On 6/30/2022 at 11:46 PM, tuanphan said: Try adding to Code Injection > Footer <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://d1j8mu9lowy9zf.cloudfront.net/twcsl/0.2.2/twcsl.js"></script> <script> document.addEventListener("DOMContentLoaded",function() { const header = document.getElementById('header'); const firstSection = document.querySelector('.page-section:first-child'); firstSection.after(header); }); </script> <style> @media screen and (min-width: 768px) { #header { position: sticky; top: 0; display: none; } main .page-section:first-child + #header { display: block; } main .page-section:first-child { min-height: calc(100vh - 93px)!important; } } </style> Hi, wanting to do the same thing, but have the code work on the home page and keep the rest of the pages the same. kopestudio.com Edited April 25, 2023 by KopeStudio Link to comment
tuanphan Posted April 26, 2023 Share Posted April 26, 2023 8 hours ago, KopeStudio said: Hi, wanting to do the same thing, but have the code work on the home page and keep the rest of the pages the same. kopestudio.com Can you add & keep the code in Code Injection? 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
KopeStudio Posted April 26, 2023 Share Posted April 26, 2023 8 hours ago, tuanphan said: Can you add & keep the code in Code Injection? Yup, done. Link to comment
tuanphan Posted April 27, 2023 Share Posted April 27, 2023 15 hours ago, KopeStudio said: Yup, done. You mean the code doesn't work on Homepage? I see it works on other page here With homepage, find & remove this code from CSS box body.homepage header#header { position: absolute !important; background: transparent !important; } 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
KopeStudio Posted April 27, 2023 Share Posted April 27, 2023 (edited) 9 hours ago, tuanphan said: You mean the code doesn't work on Homepage? I see it works on other page here With homepage, find & remove this code from CSS box body.homepage header#header { position: absolute !important; background: transparent !important; } Hi, thank you for that! It got it to work on the homepage! Edited April 27, 2023 by KopeStudio tuanphan 1 Link to comment
Form Posted August 22, 2023 Share Posted August 22, 2023 On 3/28/2021 at 4:43 AM, tuanphan said: @lysbeth123 Have you found the solution yet? Hey! Did you have a way to add a video as the banner instead of an image? Code is working great with a static image! Link to comment
tuanphan Posted August 23, 2023 Share Posted August 23, 2023 13 hours ago, Form said: Hey! Did you have a way to add a video as the banner instead of an image? Code is working great with a static image! With 7.1, just edit section > add video background. Or what is your problem? Form 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
CaleyS Posted October 27, 2023 Share Posted October 27, 2023 (edited) On 12/24/2020 at 1:29 AM, tuanphan said: Add this code to Home > Design > Custom CSS. Replace beaverhero with your banner image url. /* Add a banner */ body.homepage div#siteWrapper:before { content: ""; background-image: url(https://beaverhero.com/wp-content/uploads/2020/11/work-5382501_640-min.jpg); background-size: cover; background-repeat: no-repeat; display: block; width: 100%; height: 500px; } /* Add sticky header */ header#header { position: sticky !important; top: 0; } Is it possible to make this have an editable section, where you can add blocks of text, an image or even an email signup form? I really like this example here: https://havilahcunnington.com/#home but can't figure out how to match this style. Any help would be appreciated! Edited October 27, 2023 by CaleyS Added an example site 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