Jump to content

gallop

Member
  • Posts

    15
  • Joined

  • Last visited

Reputation Activity

  1. Thanks
    gallop reacted to tuanphan in Change mobile styling on specific block   
    @olipowell add to Home > Design > Custom CSS
    @media screen and (max-width:640px) { div#block-ce591823b8f1025afa01 * { text-align: left !important; } div#block-ce591823b8f1025afa01 { padding-top: 10px !important; padding-bottom: 20px !important; padding-left: 30px !important; padding-right: 40px !important; } }
  2. Love
    gallop reacted to rdreed in Logo loading screen - code adjustment please   
    Hi everyone, 

    I bought a plugin from Squarestud.io and it appears that they dont respond to anyone's emails/facebook/instagram - I assume they have gone bust. Anyway, I need to tweak the plugin and I am not very good at .js and would appreciate some help. 
    The plugin is a logo loading screen using the site's logo.  I am wanting to replace the image source (the existing site logo) with a gif that is stored in the site's CSS stored files - URL below.

    Any help is really really really appreciated.

    Thank you, 

    Rob 
    working site: https://pepper-clarinet-ctnt.squarespace.com/
    GIF: 
    https://static1.squarespace.com/static/5d9db9630e0cb109b5331185/t/5db877bc05d8093cb6fbfe15/1572370384602/mrnice-smiley.gif
    Code Injection: 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> <div class="logoload"></div> <script> $(function() { var loadLogo = $('header').find('img').attr('src'); $('.logoload').css('background-image', 'url(' + loadLogo + ')'); }); </script> <style> .logoload { /* SET BACKGROUND COLOR */ background-color: #fff; /* SET BACKGROUND SIZE */ background-size: 90px; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background-position: center; background-repeat: no-repeat; } </style> <script type="text/javascript"> $(window).load(function() { $(".logoload").delay(500).fadeOut("slow"); }) </script>  
  3. Thanks
    gallop reacted to tuanphan in Logo loading screen - code adjustment please   
    @rdreed Your code
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> <div class="logoload"></div> <style> .logoload { /* SET BACKGROUND COLOR */ background-color: #fff; /* SET BACKGROUND SIZE */ background-size: 90px; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background-position: center; background-repeat: no-repeat; background-image: url("https://static1.squarespace.com/static/5d9db9630e0cb109b5331185/t/5db877bc05d8093cb6fbfe15/1572370384602/mrnice-smiley.gif"); } </style> <script type="text/javascript"> $(window).load(function() { $(".logoload").delay(500).fadeOut("slow"); }) </script>  
  4. Thanks
    gallop reacted to tuanphan in Logo loading screen - code adjustment please   
    Add to Page Settings > Advanced > Header
    <script> $(window).load(function() { $('body').css('overflow', 'hidden'); setTimeout( function() { $('body').css('overflow', 'initial'); }, 5000); }); </script>  
  5. Thanks
    gallop reacted to tuanphan in Hamburger Menu Nav across all devices (version 7.1)   
    You can replace burger icon with custom three lines (here is an example img)
    Add to Home > Design > Custom CSS. Replace current image with three lines icon url
    .burger-box div { display: none; } .burger-box { background-image: url(https://static.thenounproject.com/png/3143942-42.png); background-size: contain; background-repeat: no-repeat; background-position: center center; }  
  6. Thanks
    gallop reacted to inside_the_square in Hamburger Menu Nav across all devices (version 7.1)   
    Hey @rsmith3074 - I realize you posted this weeks ago but I just now got back onto the forum and wanted to share the answer in case you still needed it! I use CSS to do this; this code does the trick for me. Hope it helps! 
     
    .header-burger { display:flex!important} .header--menu-open .header-menu {opacity: 1!important;visibility: visible!important;} .header-nav, .header-actions {visibility:hidden!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.