Jump to content

Beyondspace

Circle Member
  • Posts

    10,143
  • Joined

  • Last visited

  • Days Won

    80

Everything posted by Beyondspace

  1. Hi there You can try this snippet, add it into Advanced-> Custom code injection document.addEventListener("DOMContentLoaded", function(event) { document.querySelectorAll(".summary-metadata-item.summary-metadata-item--date").forEach(function(el) { var modified = el.innerText.replace("–", "&"); el.innerText = modified; }); });
  2. Hi there You can create a temp password for the access
  3. You can set up the css for the image as img { width: 100%; hight: auto; } If you need specific help, kindly share your current site url,
  4. Your snippet seems worked well, I edit it to match the needs .Header-nav-item { position: relative; height: 60px; line-height: 60px; text-align: center; transition: 0.5s; padding: 0 20px; cursor: pointer; -webkit-transition: 0.5s; } .Header-nav-item:hover { background-color: transparent; border-color: transparent; color: #000000; } .Header-nav-item:hover:before { transition-delay: .2s; } .Header-nav-item:before { width: 0%; height: 100%; z-index: 3; content: ''; position: absolute; top: -20px; left: 0; box-sizing: border-box; transition: .2s; } .Header-nav-item:hover:before, .Header-nav-item.Header-nav-item--active:before { width: 100% !important; transition: .7s; } .Header-nav-item:before { border-bottom: 2px solid #000000; }
  5. Please try this, Insert the snippet into Design->Custom Css .header-title-logo img { max-height: 150px !important; } .header .header-title-nav-wrapper .header-nav { display: block !important; } .header .header-burger { display: none !important; }
  6. It did slightly changes in your current solution, hopes it'll help <style> .language { position: absolute; z-index: 999; top: -20px; left: 0; display: inline-block; } .language a { border: 1px solid #000; margin: 0 5px; width: 40px; height: 20px; display: inline-block; background-position: center top; float: left; text-indent: -999999px; color: transparent; } .language [href="/en/home/"] { background: url(https://restcountries.eu/data/gbr.svg) no-repeat; background-size: cover; } .language [href="/de/home"] { background: url(https://restcountries.eu/data/deu.svg) no-repeat; background-size: cover; width: 33px } </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <script> $(function() { /* SETUP MULTI-LANGUAGE */ var defaultLanguage = 'de'; var lang = location.pathname.split("/")[1]; var defaultClass = 'lang-'+defaultLanguage+''; var itemParent = "nav [class*='collection'],nav [class*='folder'],nav [class*='index'],nav [class*='group']"; if (lang == "" || lang.length > 2 ){ var lang = defaultLanguage; } /* ADD LANGUAGE CLASSES */ $('a[href="/"]').addClass('lang-'+defaultLanguage+'').parents(itemParent).addClass('lang-'+defaultLanguage+''); $('nav a:link:not([href^="http://"]):not([href^="https://"])').each(function () { var langType = $(this).attr('href').split("/")[1]; var multiLanguageClass = 'multilanguage lang-' + langType + ''; if (undefined !== langType && langType.length <= 2) $(this).addClass(multiLanguageClass).parents(itemParent).addClass(multiLanguageClass); }); $('nav button').each(function () { var langTypeFolder = $(this).attr('data-controller-folder-toggle').split("/")[0]; var multiLanguageClass = 'multilanguage lang-' + langTypeFolder + ''; if (undefined !== langTypeFolder && langTypeFolder.length <= 2) $(this).addClass(multiLanguageClass); }); /* HOMEPAGE-LOGO LINKS TO PROPER LANGUAGE HOMEPAGE */ if (lang == "en") { $('a[href="/"]').attr("href", "/en/home/"); } /* ADD EXCLUSION NAV ITEMS */ $('.exclude-me,.exclude-me a').addClass('exclude'); $('.sqs-svg-icon--list a,.SocialLinks-link').addClass('exclude'); /* REMOVE OTHER LANGUAGES AND KEEP EXCLUDED ITEMS */ $('.multilanguage:not(".lang-'+lang+',.exclude")').remove(); }); </script> <script> /*setup language switcher*/ $('.header-title-text').prepend('<div class="language"><a href="/de/home" class="lang-en">Deutsch</a><a href="/en/home/" class="lang-es">English</a></div>'); </script>
  7. Put the code I sent into this snippet @media screen and (min-width: 600px) { /*Copy them here*/ }
  8. I did some custom code for my client on this site, is it what you want? This feature is a custom plugin for squarespace http://recordit.co/p9VOuCKBkq
  9. Hi Muffet24, Afraid there is no such option except image order, do you want to change the template files?
  10. Hi, what is your site url, I can have a look
  11. Can be, please paste this into Settings->Custom Css .header-layout-branding-center-nav-center .header-title-nav-wrapper { width: 100%; display: block; flex: 100%; }
  12. Did you added the custom css I provided? Also the first 3 images is not the same size with the ones below, should be 500x500 dimension
  13. Since you can grab the uploaded image url, I can suggest you use psuedo :after selector for this, using the unique url in the link tag a[href="/alley-house-1"]:after { background: url(https://images.squarespace-cdn.com/content/v1/5e9f52c…/1591746790510-TLM3OCA969QR248359Q9/ke17ZwdGBToddI8pDm48kNIz01GxeNglza_traDdevsUqsxRUqqbr1mOJYKfIPR7LoDQ9mXPOjoJoqy81S2I8N_N4V1vUb5AoIIIbLZhVYxCRW4BPu10St3TBAUQYVKck_3oyjxD2E6g656zntaR4vQBwPCV_Yc9BnFEdXAQ6xzMr4wPFfphDwEQcs_2fgoE/Pavilion+House+Sect_wt-1.jpg?format=300w); content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-repeat: no-repeat; background-position: center; opacity: 0; transition: opacity 0.75s; } a[href="/alley-house-1"]:hover:after { opacity: 1; } Output: http://recordit.co/HDXB6rAspQ
  14. Kindly check this snippet section[data-section-id="5ee902680f1cf9687c177bee"] { width: 100vw; } section[data-section-id="5ee902680f1cf9687c177bee"] .content-wrapper { margin: 0; width: 100%; max-width: 100%; padding: 0 !important; } section[data-section-id="5ee902680f1cf9687c177bee"] .content-wrapper .content { width: 100% !important; } section[data-section-id="5ee902680f1cf9687c177bee"] .content-wrapper .sqs-block-image { padding: 0; } section[data-section-id="5ee902680f1cf9687c177bee"] .content-wrapper .sqs-block-image img { width: auto !important; height: 100% !important; }
×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.