AnnaRadzicki
-
Posts
27 -
Joined
-
Last visited
Content Type
Forums
Gallery
Blogs
Events
Store
Downloads
Profiles
Posts posted by AnnaRadzicki
-
-
Site URL: https://kalglo.com
I added some custom code to get this red strip across the top of our website. Recently though, every time the website loads a page ( even bouncing from one page to another) it has a white line in between and then loads normally. I attached a photo of what is looks like before it fully loads, and what It looks like after ( i would like to only have the after).
Is there any code or changes needed in my current code that can fix this problem, I am somewhat at a dead end here.
-
Site URL: https://kalglo.com
I purchased a mega menu plug in from : https://www.will-myers.com/, and I am try to adjust the size of the drop down width.
The content was added into the footer, but the drop down itself takes up 100% of the screen, and this looks really weird for how little is in the FAQ dropdown (attached) . Is there anyway to make it adaptive to how much content is inside the menu? or if not, at least just make it smaller in general?
-
Site URL: https://kalglo.com
I have tried almost everything to no avail!!
I am looking to have 4 icons in total with text below like the attached snippet. Each icon has an underlining hover effect, and when clicked on a light box pops up. Is anything like this possible ? A lot of code options are giving me issue with the product add to cart button as well.
-
13 minutes ago, tuanphan said:
Use this code under #6 code
<style> div.ProductItem-details-excerpt .gallery-block * { color: #f1f !important; } </style>
I know this is a little bit different but I have tried almost everything to no avail.
I am looking to have 4 icons in total with text below like the attached snippet. Each icon has an underlining hover effect, and when clicked on a light box pops up. Is anything like this possible ?
-
On 9/19/2024 at 4:54 AM, tuanphan said:
To add Icons under Product Description, you can follow these steps.
#1. First, edit Product > Additional Info
#2. Add a Gallery Block
#3. Upload your desired icons
#4. You can click Gear icon if you want to add text under icon
Then enter text in Title box
#5. Next, choose Grid/Show Title to make text appear under icon
#6. Use this code to Website Tools > Code Injection > Footer
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script> <script> $(document).ready(function(){ $('section.ProductItem-additional .gallery-block').appendTo('div.ProductItem-details-excerpt'); }); </script>
#7. Result
Is there anyway to change the text color?
Thank you!
-
On 4/8/2021 at 7:47 PM, creedon said:
Replace my code in Store Settings > Advanced > Page Header Code Injection for the store page with the following.
Please see Store Product Detail Page Add Images Based on Tags.
For the tagImageUrlMap constant set it thusly.
const tagImageUrlMap = { /* the format of each line is a tag as appears in the SS Product page interface and an image URL */ // '[enter tag here]' : '[enter image url here]', 'chanvre' : 'https://images.squarespace-cdn.com/content/v1/5ebd776421cb6b6024d2aaf8/1591267971684-1IF105OEI4B6XI0W1GDI/ke17ZwdGBToddI8pDm48kEBW7z-dDW5qDFwbZpebXfp7gQa3H78H3Y0txjaiv_0fDoOvxcdMmMKkDsyUqMSsMWxHk725yiiHCCLfrh8O1z5QPOohDIaIeljMHgDF5CVlOqpeNLcJ80NK65_fV7S1UUXw44irD28DkWYx3-1dwLa4g0PDx-AhloRAoRgIe7QLG6v6ULRah83RgHXAWD5lbQ/Fibre+de+chanvre', 'commerce-equitable' : 'https://images.squarespace-cdn.com/content/v1/5ebd776421cb6b6024d2aaf8/1591268308127-YQP0SA25LL1AADHITEF0/ke17ZwdGBToddI8pDm48kEBW7z-dDW5qDFwbZpebXfp7gQa3H78H3Y0txjaiv_0fDoOvxcdMmMKkDsyUqMSsMWxHk725yiiHCCLfrh8O1z5QPOohDIaIeljMHgDF5CVlOqpeNLcJ80NK65_fV7S1UUXw44irD28DkWYx3-1dwLa4g0PDx-AhloRAoRgIe7QLG6v6ULRah83RgHXAWD5lbQ/commerce+equitable', 'coton' : 'https://images.squarespace-cdn.com/content/v1/5ebd776421cb6b6024d2aaf8/1591267886476-E5GICTULTY5MD5TYV4R4/ke17ZwdGBToddI8pDm48kEBW7z-dDW5qDFwbZpebXfp7gQa3H78H3Y0txjaiv_0fDoOvxcdMmMKkDsyUqMSsMWxHk725yiiHCCLfrh8O1z5QPOohDIaIeljMHgDF5CVlOqpeNLcJ80NK65_fV7S1UUXw44irD28DkWYx3-1dwLa4g0PDx-AhloRAoRgIe7QLG6v6ULRah83RgHXAWD5lbQ/Coton+biologique', 'fabriqu-en-bretagne' : 'https://images.squarespace-cdn.com/content/v1/5ebd776421cb6b6024d2aaf8/1591268443787-B3T4GA6W5T3J42ZGRFU1/ke17ZwdGBToddI8pDm48kFBrwAqVMVe6YMvCRUfVHkV7gQa3H78H3Y0txjaiv_0fDoOvxcdMmMKkDsyUqMSsMWxHk725yiiHCCLfrh8O1z5QPOohDIaIeljMHgDF5CVlOqpeNLcJ80NK65_fV7S1UbX00RdHGEtHQ765vDpm33fR-nahLRdlIB57_C9H3YJiMW9u6oXQZQicHHG1WEE6fg/Fabrique+en+bretagne', 'fabriqu-en-espagne' : 'https://images.squarespace-cdn.com/content/v1/5ebd776421cb6b6024d2aaf8/1593073740143-Z91D2AHZCIS8LEZX08YJ/ke17ZwdGBToddI8pDm48kFBrwAqVMVe6YMvCRUfVHkV7gQa3H78H3Y0txjaiv_0fDoOvxcdMmMKkDsyUqMSsMWxHk725yiiHCCLfrh8O1z5QPOohDIaIeljMHgDF5CVlOqpeNLcJ80NK65_fV7S1UbX00RdHGEtHQ765vDpm33fR-nahLRdlIB57_C9H3YJiMW9u6oXQZQicHHG1WEE6fg/Fabrique+en+espagne', // 'fabriqu-en-europe' : '', 'fabriqu-en-france' : 'https://images.squarespace-cdn.com/content/v1/5ebd776421cb6b6024d2aaf8/1591268353403-E718QG323BR2BXDO9LV9/ke17ZwdGBToddI8pDm48kEBW7z-dDW5qDFwbZpebXfp7gQa3H78H3Y0txjaiv_0fDoOvxcdMmMKkDsyUqMSsMWxHk725yiiHCCLfrh8O1z5QPOohDIaIeljMHgDF5CVlOqpeNLcJ80NK65_fV7S1UUXw44irD28DkWYx3-1dwLa4g0PDx-AhloRAoRgIe7QLG6v6ULRah83RgHXAWD5lbQ/fabrique+en+france', 'fibre-ecologique' : 'https://images.squarespace-cdn.com/content/v1/5ebd776421cb6b6024d2aaf8/1591268001210-E6FPI5559JRED5WO9FCX/ke17ZwdGBToddI8pDm48kEBW7z-dDW5qDFwbZpebXfp7gQa3H78H3Y0txjaiv_0fDoOvxcdMmMKkDsyUqMSsMWxHk725yiiHCCLfrh8O1z5QPOohDIaIeljMHgDF5CVlOqpeNLcJ80NK65_fV7S1UUXw44irD28DkWYx3-1dwLa4g0PDx-AhloRAoRgIe7QLG6v6ULRah83RgHXAWD5lbQ/Fibre+ecologique', 'fibre-recycl' : 'https://images.squarespace-cdn.com/content/v1/5ebd776421cb6b6024d2aaf8/1594238143847-J9EJA64CVP6SLXXY965B/ke17ZwdGBToddI8pDm48kEBW7z-dDW5qDFwbZpebXfp7gQa3H78H3Y0txjaiv_0fDoOvxcdMmMKkDsyUqMSsMWxHk725yiiHCCLfrh8O1z5QPOohDIaIeljMHgDF5CVlOqpeNLcJ80NK65_fV7S1UUXw44irD28DkWYx3-1dwLa4g0PDx-AhloRAoRgIe7QLG6v6ULRah83RgHXAWD5lbQ/Fibre+recycl%C3%A9e', 'lin' : 'https://images.squarespace-cdn.com/content/v1/5ebd776421cb6b6024d2aaf8/1591267922316-KC43DRIHFJX6NNVBIL3T/ke17ZwdGBToddI8pDm48kEBW7z-dDW5qDFwbZpebXfp7gQa3H78H3Y0txjaiv_0fDoOvxcdMmMKkDsyUqMSsMWxHk725yiiHCCLfrh8O1z5QPOohDIaIeljMHgDF5CVlOqpeNLcJ80NK65_fV7S1UUXw44irD28DkWYx3-1dwLa4g0PDx-AhloRAoRgIe7QLG6v6ULRah83RgHXAWD5lbQ/Fibre+de+lin', 'unisexe' : 'https://images.squarespace-cdn.com/content/v1/5ebd776421cb6b6024d2aaf8/1591268157736-F20IPEFUQN7AZUAZ6MQA/ke17ZwdGBToddI8pDm48kEBW7z-dDW5qDFwbZpebXfp7gQa3H78H3Y0txjaiv_0fDoOvxcdMmMKkDsyUqMSsMWxHk725yiiHCCLfrh8O1z5QPOohDIaIeljMHgDF5CVlOqpeNLcJ80NK65_fV7S1UUXw44irD28DkWYx3-1dwLa4g0PDx-AhloRAoRgIe7QLG6v6ULRah83RgHXAWD5lbQ/Unisexe', 'upcycling' : 'https://images.squarespace-cdn.com/content/v1/5ebd776421cb6b6024d2aaf8/1591268178661-YIQLD6FFLL4E5GA2Z15N/ke17ZwdGBToddI8pDm48kEBW7z-dDW5qDFwbZpebXfp7gQa3H78H3Y0txjaiv_0fDoOvxcdMmMKkDsyUqMSsMWxHk725yiiHCCLfrh8O1z5QPOohDIaIeljMHgDF5CVlOqpeNLcJ80NK65_fV7S1UUXw44irD28DkWYx3-1dwLa4g0PDx-AhloRAoRgIe7QLG6v6ULRah83RgHXAWD5lbQ/Upcycling', };
This code puts the images in a different place than the previous version. Also the layout is different, more suited to the product detail area.
Let us know how it goes.
I tried this with 7.1 but the code loads on the header first, then disappears with no image?
-
-
Truthfully, something is going on with all my uploaded photos, but i can always reupload them without an issue. With the products though, when i reupload its still leaving this white box
-
Site URL: https://kalglo.com
I don't understand what is happening, but this morning I woke up and on my phone you can see all the photos for my products but not on my desktop. I reuploaded my product photos, but its acting like their is a a "white block" type photo. When I go into edit product, it doesn't show any photos can be deleted by there is a gap in between the reuploaded photo. Attached is a photo of what it looks like on my phone, desktop, and the edit product. I had a photo uploaded into additional info, that has just a green landscape, and when i right click and as to open image in a new tab, it cannot find that url??? Any help would be so helpful!!
-
On 8/19/2024 at 10:33 AM, Christa1024 said:
I really need help with this if anyone is out there.
Okay so after HOURS of searching for an answer, I found a solution!!!
Fill this code out with your business information, it currently has the company information for Kalglo, so adjust your information as needed. Business name, address, hours, etc.
<script>
document.addEventListener("DOMContentLoaded", function() {
var elements = document.querySelectorAll('script[type="application/ld+json"]');
elements.forEach(function(element) {
try {
var jsonData = JSON.parse(element.innerHTML);// Update LocalBusiness schema
if (jsonData['@type'] === 'LocalBusiness') {
if (!jsonData.name || jsonData.name === "") {
jsonData.name = "Kalglo";
}
if (!jsonData.url || jsonData.url === "") {
jsonData.url = "https://www.kalglo.com";
}
if (!jsonData.logo || jsonData.logo === "") {
jsonData.logo = "https://images.squarespace-cdn.com/content/v1/660c4e785b13d204bb3dfc63/f5f5b942-da83-4772-b834-ea447cefeb4c/kalglo+logog.gif?format=1500w";
}
if (!jsonData.address || jsonData.address === "") {
jsonData.address = {
"@type": "PostalAddress",
"addressLocality": "Fogelsville",
"addressRegion": "PA",
"postalCode": "18051",
"streetAddress": "2010 Sunset Drive",
"addressCountry": "US"
};
}
if (!jsonData.telephone || jsonData.telephone === "") {
jsonData.telephone = "(610) 837-0700";
}
if (!jsonData.priceRange || jsonData.priceRange === "") {
jsonData.priceRange = "$$";
}
if (!jsonData.currenciesAccepted || jsonData.currenciesAccepted === "") {
jsonData.currenciesAccepted = "USD";
}
if (!jsonData.paymentAccepted || jsonData.paymentAccepted === "") {
jsonData.paymentAccepted = "Credit Card, PayPal, Klarna";
}
if (!jsonData.openingHoursSpecification || jsonData.openingHoursSpecification.length === 0) {
jsonData.openingHoursSpecification = [
{
"@type": "OpeningHoursSpecification",
"dayOfWeek": [
"Monday",
"Tuesday",
"Wednesday",
"Thursday",
"Friday"
],
"opens": "08:00",
"closes": "17:00"
}
];
}
element.innerHTML = JSON.stringify(jsonData);
}// Update Organization schema
if (jsonData['@type'] === 'Organization') {
if (!jsonData.legalName || jsonData.legalName === "") {
jsonData.legalName = "Kalglo";
}
element.innerHTML = JSON.stringify(jsonData);
}} catch (e) {
console.error("Error parsing JSON-LD: ", e);
}
});
});
</script>Copy the updated code and check the validity with https://search.google.com/test/rich-results. If all looks good copy and past the code into Code Injections, Footer. You can test your website with https://search.google.com/test/rich-results to make sure everything is working properly. I hope this helps!
-
1 hour ago, paul2009 said:
I'm assuming that you added the single image (containing all the icons) in an Image Block?
If you did, you can simply add more Image Blocks and place them side by side, then add one icon to each block.
Did this help? Please give feedback by clicking an icon below ⬇️
Maybe I am just confused, but when i add more image blocks they are stacked on top of each other not side by side?
-
6 minutes ago, paul2009 said:
I would encourage you to add these icon+text elements individually as HTML (preferred), or at least as individual images, so they will be responsive and wrap onto multiple rows when the screen width is small, instead of shrinking.
If you do use images, I recommend that you add some alt text to them because they currently lack this descriptive text for SEO and users with visual disabilities.
Did this help? Please give feedback by clicking an icon below ⬇️
If i upload these individually, would I still input them into additional info? Would there be a code needed to have them look how they are currently on desktop, but have multiple rows for mobile? I appreciate your help!
-
Site URL: https://www.kalglo.com/
Hello! I uploaded a picture ( free shipping, trusted since 1969, etc.) into additional info. section, but when I switch my view to mobile, it looks terrible.
I uploaded a picture of the view on both below.
Is there any code or anyway to fix the size/look on mobile only?
Thank you!
-
Site URL: https://www.kalglo.com/shop/p/hs-1208rs
I am looking to see if there is anyway to take this image (which is currently uploaded into additional information ) and have it underneath the product gallery photos? If not, then is there anyway to get it below the add to cart button ?
-
On 5/14/2024 at 1:12 PM, AnnaRadzicki said:
Created a CSS code that moves the "add" button under product add ons:
}
.product-details .pdp-product-add-ons .add-on-add-to-cart-wrapper .sqs-add-to-cart-button {
width:55px !important;
height: 55px !important;
margin-left: 200px !important;
margin-top: -40px;
} -
My website is https://primrose-gar-cl8a.squarespace.com/
I have been looking everywhere and cannot find a solution so maybe its just not possible.
I want to change the arrows on the quantity box listed on the product page. Instead of up and down, I was hoping to have a - icon on the left of the quantity and a + on the right of the quantity like the picture attached. I can't even find a plugin!
-
any answer on this?
-
On 5/15/2024 at 1:52 AM, Beyondspace said:
Try the following code instead previous one
/* Disable previous code */ .header-announcement-bar-wrapper.mega-menu-on a:hover { background: none !important; height: unset !important; } /* use psedo element to set background */ .header-announcement-bar-wrapper .header-nav-list> .header-nav-item:before{ content:''; width: 100%; /*change the width here*/ height: 100%; display: block; position: absolute; left: 50%; top:50%; transform: translate(-50%,-50%); } .header-announcement-bar-wrapper .header-nav-list>div { position: relative; z-index: 0; } .header-announcement-bar-wrapper .header-nav-list> .header-nav-item > a { z-index: 1; position: relative; } /*Background color when hovering*/ .header-announcement-bar-wrapper .header-nav-list> .header-nav-item:hover a { color: #000 !important; } .header-announcement-bar-wrapper .header-nav-list>div:hover:before { background: #fff; } .header-announcement-bar-wrapper .wm-mega-menu-trigger.active-mega::before { background: #fff; } /*Little configuation*/ .header-announcement-bar-wrapper .wm-mega-menu-trigger { display: flex; justify-content: center; align-items: center; } .header-announcement-bar-wrapper .wm-mega-menu-trigger a { z-index: 1; } .header-nav-list>div { padding-top: 5px; padding-bottom: 5px; }
Weirdly enough, this still didnt work, only made the red space bigger, which is the problem I was running into when I was trying this before bringing it to this thread. I guess its not a big deal, but wish there was some way to fill the gaps. Thanks for your help!
-
primrose-gar-cl8a.squarespace.com/
-
I am using the CSS custom section in squarespace but using chrome as my browser.
I am not sure that actually answers your question or no, i apologize!
-
Would there be any chance to get the box to stick while looking through the dropdown menu as well, i have looked everywhere. I appreciate your help!
-
The looks better for the width, but is there anyway to fill the gaps on the top and bottom that are still showing red?
Thank you!
-
-
Navigation bar glitch
in Pages & Content
Posted
nav.header-nav-list {
display: flex;
width: 100%;
border-top: 5px solid #FF3120;
border-bottom: 5px solid #FF3120;
background-color: #FF3120;
}