tuanphan

You can use this CSS code body.homepage article section:first-child { padding-top: 0px !important; }

Hi, What is site url? We can check easier

You mean width or height? If height, see #6 in this thread if width, use this CSS code to Website > Website Tools > Custom CSS div.sqs-announcement-bar-dropzone { max-width: 1000px; margin: 0 auto; }

Can you add & keep the code? I can check again easier

First, you need to add this to Website > Website Tools > Code Injection > Footer (do not add to Custom CSS) <script> if (document.location.pathname.indexOf("/search") == 0) { document.querySelector('body').classList.add('t-search') } </script> Next, add this code to Custom CSS box body.t-search { header#header, footer.sections {display: none !important;} }

Can you share link to this page? We can check and help easier

Navigation uses this class name/id div.header-nav-item>a If you still can't figure the exact code, you can share site url, we can help easier

Can you share link to page where you used Image? We can help easier

Some useful CSS for Announcement Bar. #1. Change announcement bar background color (one page) Use code to Page Header Code Injection or Code Block (Personal Plan) <!-- change announcement bar background color - One Page --> <style> .sqs-announcement-bar { background-color: #f1f !important; } </style> #2. Remove announcement bar (One page) Use code to Page Header Code Injection or Code Block (Personal Plan) <!-- remove it on one page --> <style> div.sqs-announcement-bar-dropzone { display: none !important; } </style> #3. Remove X Close icon to Custom CSS box /* remove X icon */ span.sqs-announcement-bar-close { display: none !important; } #4. Change Text Color to Custom CSS box /* change text color */ div#announcement-bar-text-inner-id * { color: #000 !important; } #5. Keep current color when overlay menu is open (text color, announcement bar background) to Custom CSS box /* keep current color when overlay menu is open */ div#announcement-bar-text-inner-id * { color: #000 !important; } .sqs-announcement-bar { background-color: #f1f !important; } #6. Hide the announcement bar on the scroll to Custom CSS box /* hide it on scroll */ header#header.shrink div.sqs-announcement-bar-dropzone { display: none !important; } #7. Move the announcement bar under the header to Custom CSS box /* move it under header */ header#header { display: flex; flex-direction: column-reverse; } #8. Apply Custom Font to Custom CSS box. Replace example font url with your custom font file url. /* apply custom font */ @font-face { font-family: 'YourFont-Name'; src: url(https://static1.squarespace.com/static/62db1f440fdb0b1fc368501f/t/64c2efcd1b07cc1531d9c65e/1690496973572/Anaktoria.otf); } div#announcement-bar-text-inner-id * { font-family: 'YourFont-Name' !important; } #9. Reduce Announcement Bar Height to Custom CSS box /* reduce height */ div.sqs-announcement-bar-text { padding-top: 0px !important; padding-bottom: 0px !important; } #10. Remove Link Underline to Custom CSS box /* remove underline */ #announcement-bar-text-inner-id * { text-decoration: none !important; } #11. Move the announcement bar to the bottom of the screen to Custom CSS box div.sqs-announcement-bar-dropzone { position: fixed !important; bottom: 0; left: 0; right: 0; width: 100%; z-index: 99999999 !important; } #12. Add an image behind the announcement bar to Custom CSS box /* add an image behind announcement bar */ div.sqs-announcement-bar { background-image: url(https://cdn.pixabay.com/photo/2024/01/18/14/46/train-8517089_1280.jpg); background-color: transparent; background-size: cover; background-repeat: no-repeat; background-position: center center; } If you have any problems, just comment below with site url.

Because your header is sticky, you can consider disable it on this page by use this code to Website > Website Tools > Custom CSS header#header { position: absolute !important; }

You can add grid-gap @media screen and (max-width:767px) { .tweak-blog-basic-grid-width-inset .blog-basic-grid { grid-template-columns: repeat(2,1fr); display: grid; grid-gap: 20px 20px !important; } } Can you share link to your blog page?

Add this to Custom CSS box div.nested-category-tree-wrapper { top: unset !important; padding: 0 !important; }

You can use this code to Website > Website Tools (under Not Linked) > Custom CSS @media screen and (max-width:767px) { div#block-e296cbe9ec21784944c7~.row .image-block .image-inset { width: 100px; margin: 0 auto; } }

Hi, Yes. Possible. Can you share link to this blog? We can test code easier

Can you share link to page where you have problems? We can check easier

Access this link, it will disable all code in Edit Mode, then you check all Code Blocks http://www.pnaiorpdx.org/config/safe

I still have some problems When you add some product to cart > Cart page > Click Checkout button > It will Open Checkout Page, but now you want to open Lightbox When users close Lightbox >> How do they pay for these products?

Try this code to Custom CSS box div#canvas[class*="-light"] .logo img { filter: invert(1) !important; -webkit-filter: invert(1); } div#canvas[class*="-dark"] .logo img { filter: invert(0) !important; -webkit-filter: invert(0); } img[data-weight-topleft="dark"]~.collection-detail-wrapper a { background-color: black !important; color: white !important; } img[data-weight-topleft="light"]~.collection-detail-wrapper a { background-color: white !important; color: black !important; }

What is password?

Can you share link to site in video?

You can consider move scroll bar & make it to 2 or 3 rows if you have too many categories @media screen and (max-width:767px) { ul.nested-category-children { overflow: hidden !important; flex-wrap: wrap !important; } }

With mobile, my idea is add an Accordion Block to Footer then we can use code to replace current mobile menu with this Accordion Block, to achieve Dropdown Menu on mobile What do you think?

Try this code to Website > Website Tools (under Not Linked) > Custom CSS @media screen and (min-width:992px) { header#header { mix-blend-mode: difference; background-color: transparent !important; } header#header * { color: white !important; } }

Hi, Can you share link to this page?

Solved via email. @media screen and (max-width: 767px) { div#block-yui_3_17_2_1_1706646947586_109917+.row { display:-webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse } }