Jump to content

Shadmon

Circle Member
  • Posts

    232
  • Joined

  • Last visited

  • Days Won

    8

Reputation Activity

  1. Like
    Shadmon got a reaction from GemmsyA in How to create vertical timeline in Squarespace   
    If you are looking for a way to add a timeline to your Squarespace site, you will love this Timeline Guide: https://squarestash.com/code/squarespace-timeline-guide/
    It has four awesome timeline plugins for you to choose from, two of them are free and two of them are paid. Paid plugins are built with the Squarespace editor, eliminating the need for custom code. They work perfectly with the Squarespace editor and look amazing on your site.
    I hope you find this guide and the plugins useful and fun. If you have any questions or need any help, just let me know. I'm always happy to help.
  2. Like
    Shadmon got a reaction from nayu_vuhido75 in Blinking Homepage on Mobile Only   
    Nothing wrong with the code. Can you send the URL of your website so that I can check.
  3. Love
  4. Love
    Shadmon got a reaction from nayu_vuhido75 in Match drop down menu style to site header   
    Can you add this css and let me know if it works?

    .header-nav .header-nav-item--folder .header-nav-folder-content {
        backdrop-filter: blur(4px);
        background: transparent !important;
    }
  5. Like
    Shadmon got a reaction from nayu_vuhido75 in Parallax Scroll BG   
    Sure, You can do that. Here is the updated code. Replace the data-section-id with yours. [data-section-id="123"]{ .section-background{ &::after { /*creating the element*/ content: ""; width:100%; height:100%; position: absolute; /*adding the image*/ background-image:url(image.jpeg); background-repeat:no-repeat; /*positioning the image*/ background-size:cover; background-position:center center; background-attachment: fixed; /*mobile*/ @media(max-width:787px){ background-position:center center; background-attachment: fixed !important; } } } }
  6. Thanks
    Shadmon got a reaction from nayu_vuhido75 in I want to add two buttons in my navigation   
    Hi, You can check out this solution here:
    Let me know if it helps!
  7. Like
    Shadmon got a reaction from vokoru_yoki16 in Header after   
    Okay, Please update the other CSS code with this. It's the final one. It should work. Let me know how it goes.

    @media (max-width: 600px) {
    .header .header-title--use-mobile-logo .header-mobile-logo img {
        max-height: 40px;
    }
    .header-announcement-bar-wrapper {
        padding-bottom: 5px !important;
        padding-top: 10px !important;
    }
    header#header::after {
        height: 20%;
        margin-top: -5px;
    }
    }
  8. Love
    Shadmon got a reaction from vokoru_yoki16 in How do you Center-Align the Mobile Store Page Layout?   
    Hi, Sure you can do that. You can add this code to Website > Website Tools > Custom CSS

    @media only screen and (max-width: 767px) {
      .products .grid-item {
        width: 100% !important;
      }
    }

    Let me know if it works!
  9. Thanks
    Shadmon got a reaction from vokoru_yoki16 in h4 font styling css not working   
    Hi, You can use Dancing Script. You can add this code to Website > Website Tools > Custom CSS
     
    @import url('https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap');
    h4 {
      font-family: "Dancing Script", cursive;
      font-optical-sizing: auto;
      font-weight: 400;
      font-style: normal;
    }

     
  10. Like
    Shadmon got a reaction from vokoru_yoki16 in How to make an iFrame pop up when a button is clicked   
    Hi Tim, Maybe you need to consider implementing a lightbox feature for the iFrame pop-up. This would activate when users interact with the button.
  11. Like
    Shadmon got a reaction from vokoru_yoki16 in Header after   
    Hi, You can add this code to Website > Website Tools > Custom CSS

    @media (max-width: 600px) {
    .header .header-title--use-mobile-logo .header-mobile-logo img {
        max-height: 40px;
    }
    .header-announcement-bar-wrapper {
        padding-bottom: 5px !important;
        padding-top: 10px !important;
    }
    header#header::after {
        height: 20%;
    }
    }

    Let me know if it helps!
  12. Thanks
    Shadmon got a reaction from vokoru_yoki16 in How to change the newsletter position in the mobile version   
    Please add this CSS code to your website; your popup will appear in the middle of the mobile screen. You can add this code to Website > Website Tools > Custom CSS

    @media (max-width: 600px) {
    .sqs-popup-overlay {
        top: 15% !important;
    }
    }
  13. Like
    Shadmon got a reaction from DavidStewart in Reduce space between mobile drop down menu page links?   
    Hi @turnerelectrical You can adjust the space between the items by increasing the margin 0px. If you add this css, you will see no space between the items: adjust the margin px for the height.

    .header-menu-nav-item a {
        margin: 0px auto;
    }

    Let me know if it works.
  14. Thanks
    Shadmon got a reaction from terih_okici79 in Redirect to a page instead on promotional pop up   
    Hi @LucieGbt1993 You can add this code instead :

    // 2000 milliseconds = 2 seconds -> You can change the number to delay. For example: 5000 will be 5 seconds.
    <script>
    setTimeout(function() {
        window.location.href = "/your-url";
    }, 2000);
    </script>
     
  15. Thanks
    Shadmon got a reaction from terih_okici79 in Full width blog post image   
    Hi, Thank you for letting me know. Please update this CSS line only :

    #article- {
        padding-top: 0;
        margin-top: -80px;
    }

    Let me know if it works !
  16. Love
    Shadmon got a reaction from terih_okici79 in Custom Hamburger - Change On Hover?   
    @FTWSGEM Hi, You can add this CSS code. Just add your image there and it will show on hover.

    .burger-inner:hover::after {
        background-image: url(add your image url here);
    }
    Let me know if it helps!
  17. Thanks
    Shadmon got a reaction from terih_okici79 in Slide In Image Removes Scroll Bar - Help!   
    Hi @FTWSGEM
    The issue you're facing with the disappearing scrollbar stems from the overflow:hidden; rule applied to the body element within your CSS.
    So, Please remove this line from your CSS:

    body 
    {
      overflow:hidden;
    }
    It will fix your issue. Let me know if it works!
  18. Like
    Shadmon got a reaction from terih_okici79 in Making Hamburger Menu Full Width on Mobile   
    Here is the CSS code you can use. Website > Website Tools > Custom CSS.

    #sidecarNav {
        width: 100%;
        z-index: 9;
    }

    Let me know if works for you!
  19. Love
    Shadmon got a reaction from wosu-cupece43 in Applying Black Overlay to Homepage Banner Image   
    If you want to change the overlay color of the background image by CSS. Then here it is:

    [data-section-id="6545523923d13742e6e76fe4"] .section-background-overlay {
        background-color: #000;
    }

    But, I suggest you change the overlay color from (in Styles -> Color, and pick the relevant theme) as Ziggy mentioned.
    I hope it helps!
  20. Thanks
    Shadmon got a reaction from wosu-cupece43 in Need Help Adjusting Video Banner Height for Mobile Viewing   
    For fixing the height of your homepage video banner on mobile. Please add this CSS code.
    Website > Website Tools > Custom CSS.
     
    @media (max-width: 640px) { #home-top { min-height: 30vh !important; } #home-top .sqs-block-spacer { display: none; } }  
    Let me know if it works!
     
  21. Thanks
    Shadmon got a reaction from turnerelectrical in Match drop down menu style to site header   
    Can you add this css and let me know if it works?

    .header-nav .header-nav-item--folder .header-nav-folder-content {
        backdrop-filter: blur(4px);
        background: transparent !important;
    }
  22. Like
    Shadmon got a reaction from wapi_lajugo63 in How to create horizontal timeline in Squarespace   
    Hey, I have created a horizontal timeline plugin for Squarespace works on both versions (7.0 and 7.1) that you might find useful. It has two styles that you can see in the screenshots below. My plugin is fully compatible with Squarespace and you can customize every text and style from the editor.
     
    Squarespace Alternative Horizontal Timeline
     

     
    Squarespace Horizontal Timeline Plugin
     

     
    I hope this plugin can be a valuable resource for those looking to add a timeline to their Squarespace site. Please feel free to reach out if you have any questions or need further assistance.
     
  23. Like
    Shadmon got a reaction from lesu-wacosi75 in How to create vertical timeline in Squarespace   
    Hey @GlynMusica I wanted to share that I’ve developed a Squarespace timeline plugin that might be of interest to you. Works on both versions (7.0 and 7.1)
    The plugin is built with the Squarespace editor, so there’s no need for custom code. It’s user-friendly and designed to integrate seamlessly with your Squarespace site.
    You can find the plugin here:

    Vertical Timeline
    https://squarestash.com/product/timeline-01/ and

    Alternative Vertical Timeline
    https://squarestash.com/product/timeline-02/
    I hope this plugin can be a valuable resource for those looking to add a timeline to their Squarespace site. Please feel free to reach out if you have any questions or need further assistance.

    Screenshot of Vertical Timeline:



    Screenshot of Alternative Vertical Timeline:


     
  24. Like
    Shadmon got a reaction from lesu-wacosi75 in Keep user on same page when pressing action button in promo pop up   
    @popofglitter Please use this default URL for users to stay on the same page.
    /inquire Let me know if it works for you!
  25. Like
    Shadmon got a reaction from lesu-wacosi75 in Change colour of selected buttons   
    Please add this CSS to your website: You can add this code to Website > Website Tools > Custom CSS

    .ProductItem-details .variant-radiobtn-wrapper input[type="radio"]:checked + label {
        color: #fff !important;
    }
    Let me know if it works!
×
×
  • 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.