tuanphan

Yes. This is possible. 
If you share link to page where you use carousel, we can help you achieve this

Use CSS like this
div.blog-item-author-profile-wrapper * { font-family: 'Josefin Sans' !important; }  

You can create a Folder with Name: Shop
Next, add 2 Link Items in Folder, first with name: New Arrivals, link to new arrivals page or category, second with Best Sellers link.
To make folder title "Shop" clickable, you will need to use code, you can add it first + share site url, then we can give you code to make this clickable to shop page
 

Use this code to Custom CSS
@media screen and (max-width:767px) { section[data-section-id="65786538301caa326ce2e675"] .gallery-grid-wrapper .gallery-grid-item { min-width: 25% !important; } }  

Change your code to this
body.homepage { .header-title-logo img { visibility: hidden; } .shrink .header-title-logo img { visibility: visible; }}  

You can use this code to Website Tools (under Not Linked) > Custom CSS
@media screen and (min-width:901px) { .collection-type-blog.blog-sidebar-right #mainContent { margin-right: 550px !important; } }  

Add to Last Line in Code Injection > Footer
<script> $(document).ready(function(){ $('section.ProductItem-additional .image-block').insertAfter('.ProductItem-gallery-slides'); }); </script> <style> .ProductItem-gallery-slides { overflow: visible !important; } .ProductItem-gallery { overflow: visible !important; flex-wrap: wrap; } .ProductItem-gallery .image-block { width: 100% !important; flex: 1 1 100% !important; } .ProductItem-gallery .image-block .has-aspect-ratio { padding-bottom: 40% !important; } </style>

background-attachment: fixed won't work on mobile, you can consider disable effect on mobile only

Ah, I targeted wrong ID. Use this new code
html[lang="de-CH"], html[lang="de"] { .fe-block-yui_3_17_2_1_1704897992777_9256 { display: none; }} html[lang*="en"] .fe-block-yui_3_17_2_1_1704897992777_6100 { display: none !important; }  

You can use this code to Website Tools (under Not Linked) > Custom CSS
div.header-nav-item:nth-child(2) { position: absolute; right: 2vw; }

You can add this code to Website Tools (under Not Linked) > Custom CSS
nav#main-navigation { position: absolute !important; right: 0 !important; }  

I see mobile logo is small. You can consider increase its size

To add Info under Add to Cart
You can add it to Product Additional, then we can use code to move it under Add to Cart.
You can add then share link to a product, we can check easier

Use this new code
div.image-block:hover { transform: scale(1.3); transition: all 0.3s; } div.image-block { transition: all 0.3s; }  

Use this CSS code
.ProductItem-gallery-carousel-controls .product-item-gallery-carousel-control { width: 50px !important; height: 50px !important; background: #fff; border-radius: 50%; } .ProductItem-gallery-carousel-controls .ProductItem-gallery-next:after { font-size: 40px; font-family: 'squarespace-ui-font'; content: "\E02D"; display: inline-block; color: rgb(199, 199, 199); transform: unset !important; border: unset; width: 50px; height: 50px; line-height: 50px; } .ProductItem-gallery-carousel-controls .ProductItem-gallery-prev:after { font-size: 40px; font-family: 'squarespace-ui-font'; content: "\E02D"; display: inline-block; color: rgb(199, 199, 199); transform: rotate(180deg) !important; border: unset; width: 50px; height: 50px; line-height: 50px; } .ProductItem button.product-item-gallery-carousel-control { justify-content: center !important; }  

Footer
It links to 404 page

Similar Learn more button on this page
https://www.whatabouthellministry.com/share-salvation
 

You can adjust 30 to another number

You can use #3 code in this thread
 

You can try this code to Website Tools (under Not Linked) > Custom CSS
body { background-color: white !important; }  

You can add this code to Website Tools (under Not Linked) > Custom CSS
.avatar { display: none !important; }

You can add this code to Website Tools (under Not Linked) > Custom CSS
.header-actions.header-actions--left { position: absolute !important; right: 0; top: 0; } .header-actions.header-actions--left a:first-child { position: relative; right: -2.5vw; }  

Try adding this code to Website Tools (under Not Linked) > Custom CSS
@media screen and (min-width:992px) { .imageWrapper.has-info { overflow: visible !important; margin-right: 516px !important; } .image-detail-wrapper { opacity: 1 !important; z-index: 1 !important; left: unset !important; right: 30px !important; top: 50% !important; transform: translateY(-50%) !important; } }  

Not sure why, but you can add this to Website Tools (under Not Linked) > Custom CSS to fix problem
blockquote { border-left: 4px solid #dadada; padding-left: 2em; }

Suppose you want to change color of "Care/Of" text, use this code to Custom CSS box
a.grid-item[href="/work/american-portraiture-xez9p"]:hover h3.portfolio-title { color:#f1f; } /work/...9p is Care/Of URL slug

(1) First, add this code to Website Tools (under Not Linked) > Code Injection > Footer
<a href="https://google.com" target="_blank" class="image-ads"> <img src="https://cdn.pixabay.com/photo/2023/12/20/07/04/clouds-8459053_1280.jpg"/> </a> <!-- DO NOT ADJUST BELOW THIS LINE --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script> <script> $(document).ready(function(){ $('.image-ads').appendTo('.code-block .image-ads'); }); </script> Change Google.com with your new url. Change Pixabay with your image url
(2) Next, edit page where you want to place Ads Image > Add a Block > Choose Code > Paste this code
<div class="image-ads"></div>