tuanphan

You can use this code to Website > Website Tools > Custom CSS
@media screen and (max-width:991px) { .header-menu-nav-folder[data-folder="root"] { } .header-menu-actions.language-picker.language-picker-mobile { order: 1 !important; } .user-accounts-link.header-menu-nav-item { order: 2 !important; margin-bottom: 0px !important; } .header-menu-nav-wrapper { order: 3 !important; } .header-menu-actions.social-accounts { order: 4 !important; } .header-menu-nav-folder-content { order: 2; } .user-accounts-link.header-menu-nav-item>a { margin-bottom: 0px !important; } }  

You can use this code to Website > Website Tools > Custom CSS. Replace #f1f with color what you want
body#collection-661c7c2b0a4b270f2bffe2b4 [data-section-id="661342ed5db1a052094e8bdf"] { .section-border, .section-background { background-color: #f1f !important; }}  

Hi,
You can add Services folder, then we can give code to make "Services" title clickable to new page

You can setup password & share url, we can check easier
If you are using Gallery Grid (Gallery Section), use this code to Website > Website Tools > Custom CSS to adjust size, color..
p.gallery-caption-content { font-size: 18px !important; color: #f1f; font-family: monospace !important; letter-spacing: 1px !important; } if you are using Gallery Grid (Gallery Block), use this CSS code to prevent text cut off
div.image-slide-title { white-space: initial !important; overflow: visible !important; text-overflow: initial !important; } to adjust size, color,... use this CSS code
div.image-slide-title { color: #f1f; font-size: 20px !important; line-height: 20px; }  

You can use this code to Website > Website Tools > Custom CSS
/* Show Portfolio without scroll */ @media screen and (max-width:767px) { div#gridThumbs { opacity: 1 !important; transform: unset !important; } }  

You can use this code to Website > Website Tools > Custom CSS to fix problem
@media screen and (max-width:767px) { section.pdp-product-add-ons { margin-top: 50px !important; } }  

Your code is HTML, not CSS, if you add there, syntax error will appear.
You can share site url, we can give you correct code

First, you need to enable Gallery Grid Caption

Next, add some Text
Next, use this code to Website > Website Tools > Custom CSS
figcaption.gallery-caption.gallery-caption-grid-simple { background-color: rgba(0,0,0,0.5); position: absolute; bottom: 0; text-align: right; padding: 0 !important; } figure.gallery-grid-item { position: relative; } figcaption.gallery-caption.gallery-caption-grid-simple p { color: white; margin-right: 5px; padding-top: 5px; padding-bottom: 5px; } Result

You can add a text/hyperlink in Excerpt, then we can use JS code to move its position next to current metadata.

Access your site edit mode > Websites > You will see 3 items under Main Navigation, you can hover and drag them to Not Linked.

First, add 6 sections
Edit 6 sections > Add a Block > Choose Code > Paste this line
<div class="checkboard-item"></div>  
Next, add this code to Website Tools (under Not Linked) > Code Injection > Footer
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script> <script> $(document).ready(function(){ $('.code-block .checkboard-item').closest('section.page-section').addClass('checkboard-design'); $('section.checkboard-design').wrapAll('<section class="checkboard-design-parent"></section>'); }); </script> <style> @media screen and (min-width: 768px) { .checkboard { display: flex; flex-wrap: wrap; } .checkboard section { width: 33.3333% !important; } } </style> if it doesn't work or doesn't work properly, you can share link to page where you apply the code, I can check it again easier

I think you can consider using 2 pages, each page 75 images, then add load more button under, link to second page.
Or if you use a Business Plan or higher, we can use code to hide image 76, 77...then add a button with code, click it will show all images.

You can use this code to bottom of Code Injection > Footer
<script> $(document).ready(function(){ $('.header-display-desktop .header-actions--right .header-actions-action').appendTo('nav.header-nav-list'); }); </script> <style> nav.header-nav-list { align-items: center; } nav.header-nav-list>.header-actions-action:last-child { display: none; } </style>

You can add this code to Home Page Header Code Injection (Do not add to Custom CSS)
Replace example image url with your image url (line 3)
<div class="splash-wrapper" id="loader-container"> <!-- Lottie animation player --> <img src="https://content.invisioncic.com/p289038/monthly_2023_11/LogoTANIQtransparent.thumb.png.0c1808606ac76767e354e33194011587.png"/> </div> <style> div#loader-container img { max-width:500px; } /* Loader animation styles */ .splash-wrapper { display: none; /* Initially hidden */ position: fixed; z-index: 9999; background-color: white; height: 100vh; width: 100vw; display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; animation-name: slideOut; animation-fill-mode: forwards; animation-duration: 0.65s; animation-delay: 5s; } @keyframes slideOut { from { margin-left: 0vw; } to { margin-left: -100vw; } } @media screen and (max-width:767px) { div#loader-container { background-size: cover; } div#loader-container img { max-width: 300px; } } </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script> <script> $(document).ready(function () { setTimeout(function(){ $('.splash-wrapper img').fadeIn(500); }, 3000); }); </script>  

You can use this code to Website > Website Tools > Custom CSS
div.header-display-mobile .header-actions.header-actions--right { position: relative; right: 4vw; }  

You can use this new CSS code
body#collection-659478f9fc420f3254c5d2d1 .summary-title-link { pointer-events: none; }  

You can use this CSS code
div.product-block img { border-radius: 100px !important; }  

(REMEMBER TO SAVE A COPY OF YOUR CURRENT CODE SOMEWHERE, before edit anything)
First, add this code to top of your Universal Filter Plugin code
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
Next, find this code (bottom of Filter Plugin code)

and change it to this
search: { enabled: true,// if false, no Search input will be showed text: 'Search By Name', searchFunc: 'title', }, hooks: { onFilter: function(){$('[class*="blog-"] article.blog-item a').attr("target","_blank");}, } } }] };

You can use this code to Website > Website Tools > Custom CSS
@media screen and (max-width:1024px) { div#block-yui_3_17_2_1_1713518553034_6252 .slide { width: 25% !important; } div#block-yui_3_17_2_1_1713518553034_6252 img { width: 100% !important; height: auto !important; top: 0 !important; left: 0 !important; } }  

You can use this code to Website > Website Tools > Custom CSS to fix problem
.collection-type-gallery #thumbnails .thumb img:hover { opacity: 1 !important; }  

Try this new code (I adjusted some IDs)
<script> /*Attribute search bar to header*/ $(function(){ let searchBlock = $('.fe-block-yui_3_17_2_1_1711999726209_7879 .sqs-block').attr('id','').addClass('header-search-bar'); /*Place desktop search bar*/ $(searchBlock).appendTo($('nav.header-nav-list')); /*Create & place mobile search link*/ $(searchBlock).clone().addClass('mobile-header-search-bar').appendTo($('[data-folder="root"] .header-menu-nav-folder-content')); }) </script> <style> nav.header-nav-list .sqs-block, nav.header-nav-list input { padding: 1px !important; } </style>  

You can use this code to Website > Website Tools > Custom CSS
header#header { border-bottom: 5px solid red; } header#header:after { content: ""; position: absolute; bottom: -15px; left: 0; width: 100%; height: 5px; background-color: red; }

You can use this code to Website > Website Tools > Custom CSS
a#site-title:after { content: "my name"; display: block; color: grey; font-size: 14px; } a#site-title { line-height: 30px; }  

First, change left to right
Next, add this code under
footer .socialaccountlinks-v2-block nav { align-items: flex-end !important; }  

Try this code to Website > Website Tools > Custom CSS > Then save & reload the page
@media screen and (max-width:767px) { .gallery-reel { height: 35vh !important; } }