tuanphan

Needs to be added sometimes, but always best to try not too when possible. Glad it's working for you!

Thank you this worked!

Hi,
Can you share link to your site? We can check easier

Use this code to Website Tools (under Not Linked) > Custom CSS
nav.header-nav-list { flex-wrap: nowrap !important; }  

#1. Change code to this
body.homepage { figure.gallery-masonry-item { position: relative; } .gallery-caption { position: static; } /* title */ .gallery-caption-content { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: center; align-items: center; z-index: 999; transition: opacity ease 200ms !important; opacity: 0 !important; pointer-events: none; height: 10% !important; } .gallery-masonry-item:hover .gallery-caption-content { opacity: 1 !important; } /* overlay */ .gallery-masonry-item-wrapper a:after { background: rgba(0,0,0,1); /* overlay color */ content: ""; display: block; position: absolute; height: 10%; /* overlay height */ left: 0; right: 0; bottom: 0; opacity: 0; transition: opacity ease 200ms !important; } .gallery-masonry-item:hover .gallery-masonry-item-wrapper a:after { opacity: 0.75; } .gallery-masonry-item * { color: white; } /* remove gap */ figcaption { padding: 0 !important; } } #2. Whole text bold or which text?

Thanks @tuanphan I've found a solution:
 
// Product Variant Button (Full Width and Stacked) - Ghost // .ProductItem-details .variant-radiobtn-wrapper label { text-align: center; margin: 5px 0px; display: block !important; width: 100% !important; } /* Product variants widht button on mobile */ @media screen and (max-width:767px) { .product-variants { width: 100% !important; } } /* Add to cart button on mobile */ @media screen and (max-width:767px) { .ProductItem-details-checkout .sqs-add-to-cart-button-wrapper, .ProductItem-details-checkout .sqs-add-to-cart-button-wrapper div { width: 100% !important; } }  

Thank you @tuanphan that was it!

Thank you @tuanphan! You're a legend on this forum

This looks like it might be an SS issue. But before you contact customer service...
What happens if you set 404 page back to the System Default? Design > Not Found / 404 Page.

update: found out I can do a grid layout with just one raw. Solves the problem.

It worked perfectly, thanks!

You can use this code to Design > Custom CSS (or Website > Website Tools > Custom CSS)
/* Blog new logo */ body[class*="type-blog"] header#header img { content: url(https://cdn.pixabay.com/photo/2023/05/13/14/35/white-flower-7990645_1280.jpg); }  

okay ~~
i think creating the dropdown menu involves a combo of html, css, and a dash of javascript
you'll need a basic html structure for your dropdown menu
<nav class="dropdown-menu"> <button class="dropdown-btn">Menu</button> <div class="dropdown-content"> <a href="#">Link 1</a> <a href="#">Link 2</a> <a href="#">Link 3</a> </div> </nav> now, let's style that menu using css
this is where you'll make it look nice and cover the whole website
body { font-family: Arial, sans-serif; } .dropdown-menu { position: fixed; /* This will make it cover the whole website */ top: 0; left: 0; width: 100%; background-color: #333; /* Customize the background color */ } .dropdown-btn { background-color: #333; color: white; border: none; padding: 15px 20px; cursor: pointer; } .dropdown-content { display: none; /* Hide the dropdown content by default */ position: absolute; background-color: #f9f9f9; width: 100%; } .dropdown-content a { color: black; padding: 12px 16px; text-decoration: none; display: block; } .dropdown-content a:hover { background-color: #ddd; } and let's add some java to make the dropdown interactive
const dropdownBtn = document.querySelector('.dropdown-btn'); const dropdownContent = document.querySelector('.dropdown-content'); dropdownBtn.addEventListener('click', function() { if (dropdownContent.style.display === 'block') { dropdownContent.style.display = 'none'; } else { dropdownContent.style.display = 'block'; } }); javascript code makes the dropdown menu appear and disappear when you click the menu button

To disable draft project page, follow this
First, add this code to Design > Custom CSS
/* Hide Draft Portfolio */ div.portfolio-grid-basic .grid-item[href*="draft"] { display: none; } Next, Edit Project >> Add this into URL: draft
Assuming project has url is  /artists/dawn-waters-bake change it to  /artists/dawn-waters-bake-draft
Above code will hide all projects whose urls contain text “draft” in portfolio page

Add to Design > Custom CSS
body.collection-649227fc70d8b7335c60dd98 .gallery-grid-item>div img { border-radius: 30px !important; }  

Because your last item is Koble Creates, you are using CSS code to remove it
To remove an item from Header, no need to use code, just drag it from Main Navigation to Not Linked
In case you still want to keep code, use this code to remove /
div.header-nav-item:nth-child(3) a:after { display: none; }  

You can use white-space: nowrap;
.user-accounts-text-link { visibility: hidden; } .user-accounts-text-link:before { visibility: visible; content: "New text"; position: absolute; white-space: nowrap; }  

ID of page: body#collection-651773418cb7780c567aedd0

You can add this code to Website Tools (under Not Linked) > Custom CSS
/* Summary List Space */ .sqs-block-summary-v2 .summary-block-setting-design-list .summary-item { margin-bottom: 0px !important; padding-bottom: 5px !important; }  

Add to Design > Custom CSS
article.blog-basic-grid--container.entry.blog-item.is-loaded { background-color: white; text-align: center; }  

I also have this list

Hi,
Not possible. But you can consider use a Blog Page with 30 blog posts, then just set blog page hidden

Use this CSS code to remove spacing under title on mobile
/* Mobile blog title spacing */ @media screen and (max-width:767px) { .blog-item-top-wrapper { margin-bottom: 10px !important; } }  

Add to Design > Custom CSS
/* center mobile text */ @media screen and (max-width:767px) { div#block-1d059d686d8bc4e3cc4f * { text-align: left !important; } .fe-block.fe-block-f56f8bdbd32d6261f262 * { text-align: left !important; } }  

Try this CSS
@media screen and (max-width:1100px) { div.header-display-desktop { align-items: center !important; } }