Jump to content

will2

Circle Member
  • Posts

    18
  • Joined

  • Last visited

Posts posted by will2

  1. Hi there

    I hope someone can help me out with an issue:) 

    I need to add a logo to my page and in various places across the site (not in the header) I have been adding it as an image block but unfortunately on some screen sizes this logo crops is there anyway to stop it cropping and just display at the same size across all screen sizes. I have tried a gallery image instead but cant resize it to be small enough.

     

    I have attached a screenshot of the homepage to illustrate the issue any ideas would be much appreciated:)

    I also have the same issue with the. logo in the footer (screenshot added) 

    Thanks in advance

    Will

     

    https://green-aardvark-exdh.squarespace.com/

    Screenshot 2024-02-06 at 14.27.46.png

    Screenshot 2024-02-06 at 14.36.12.png

  2. Hi There:)

    I would be really grateful if anyone can help at all I just cant seem to solve this issue myself:)

    I am trying to create even white borders around all of my content across mobile and desktop.

    I am really struggling to get this to work, it seems to work on desktop but on mobile the images above the gallery block don't show a border on the left and right, if I try to add this in in (adding border to whole site, adding img padding, adding margins etc) it adds this also onto the gallery block too which means the gallery block has a larger border than the green image above.

     

    To summarise what i am trying to achieve is 

    - Even white borders/white space around every image (not doubled up vertically)

    - Even gap between images in the gallery block.

    - For this to somehow work across both mobile and desktop

    - Everything to line up

    - I need to duplicate this page and apply it to lots of other pages so im hoping for a solution that could be a site wide change rather than targeting specific sections

     

    I have attached a screen shot to show the issue and what i'm hoping to achieve and the very messy css that i have currently added:)

    Thanks in advance for any help:)

    the site address is 

    https://green-aardvark-exdh.squarespace.com/

    the password is - testing123

    The page that shows the issue is called - /work5/norlo-border-issue

     

    
    /*STYLING THE ACTIVE NAV LINKS IN SQUARESPACE 7.1*/
    
    //Mobile active link
    :is([aria-current="page"], [aria-current="true"]) .header-menu-nav-item-content {
      background-image: none;
     text-decoration: underline;
      
    }
    
    
    /*---hover effect on portfolio grid---*/
    
     .grid-item:hover img:hover {
        transform: scale(1.1);
         -webkit-transition: all .5s;
         -moz-transition: all .5s;
         transition: all .5s;
    }
    
    /*----Desktop Fonts----*/
     
     h1{
         font-size:3em !important;
    }
     
     h2{
         font-size:2em !important;
    }
     
     h3{
         font-size:5em;
         line-height:1em!important;
    }
     
     .header-menu-nav-item a {
         font-size:9vw!important;
         line-height:6vw!important;
    }
    
    /*---DESKTOP Project Next Titles and Arrows---*/
    
     .item-pagination-link .item-pagination-title {
         margin: 0;
         padding: 0;
         line-height: 1;
         font-size:1.5vw!important;
         padding:10px;
    }
    
    .item-pagination-link .item-pagination-icon svg {
        width: 15px;
        height: 41px!important;
     
    }
    
     .icon--stroke svg {
         stroke-width: 3px;
         fill: transparent;
    }
    
    
    
    
    /*---Mobile Fonts---*/
     
     @media screen and (max-width:767px) {
         h1{
             font-size:1.4em !important;
        }
         h2{
             font-size:1.2em !important;
        }
         h3{
             font-size:2.5em;
             line-height:1em!important;
        }
       
      
        
    /*---Mobile Fonts - SECONDARY BUTTON SIZING ON MOBILE---*/
    
         div.button-block a[class*="secondary sqs-block-button-element"].sqs-block-button-element {
             font-size: 1em !important;
             padding-top: 5px !important;
             padding-bottom: 5px !important;
             padding-left: 2px !important;
             padding-right: 2px !important;
             height: auto !important;
        }
        
    /*---Mobile Fonts - HIDE SCROLLING TYPE ON MOBILE---*/
         
         .Marquee-svg{
             display:none;
        }
        
    /*---MOBILE Project Next Titles---*/
         
         .item-pagination-link .item-pagination-title {
             margin: 0;
             padding: 0;
             line-height: 3.5vw;
             font-size:3vw!important;
        }
       .item-pagination-link .item-pagination-icon svg {
        width: 15px;
        height: 35px!important;
     
    }
    
     .icon--stroke svg {
         stroke-width: 3px;
         fill: transparent;
    }
       
       
    }
     .header-menu-nav-item a{
         text-align:left;
    }
    
    
    
    /*---DELETE if nothing effected????????????????????
     
     [data-section-id="ID_HERE"] {
         min-height:clamp(0px, 56.25vw, 100vh) !important;
    }
    */
    
    /*---BURGER MENU---*/
    
    /*---BURGER MENU THICKNESS---*/
     .top-bun, .patty, .bottom-bun {
         height: 5px !important;
    }
    
    /*---END BURGER MENU THICKNESS---*/
    
     div.header-nav-item--active a {
         background-image: none !important;
    }
     .header-menu-nav-item a {
         font-size: 10vw;
         line-height:5.5vw;
         font-weight:800!important;
    }
     .header-burger {
         display:flex!important
    }
     .header--menu-open .header-menu {
        opacity: 1!important;
        visibility: visible!important;
    }
     .header-nav, .header-actions {
        visibility:hidden!important
    }
    /*----END BURGER MENU---*/

     

    Screenshot 2024-01-26 at 09.11.11.png

  3. i noticed that there was an extra @fontface at the start when i delete this the incorrect font seems to default to arial (which is the font specified in the site styles section) not sure sure if that helps at all?

     

    @font-face {

    // CUSTOM FONTS

    @font-face {
      font-family: 'Akrobat-Black';
      src: url(https://static1.squarespace.com/static/65534bd6e534764e6fc121e0/t/65aadd79d6807d2f11c8fd66/1705696634028/Akrobat-Black.woff2) format('woff2');
    }


    h2 {
      font-family: 'Akrobat-Black' !important;
      text-transform:uppercase;
    }


     

  4. Hi Everyone:)

    I'm struggling to get a certain custom font to show up in safari, it works perfectly in chrome but for some reason doesn't show up in safari, I don't suppose anyone has any ideas at all? I have uploaded various font formats but no joy:)

    my website link is

    https://turquoise-dragonfly-d82m.squarespace.com

    Password - hartridges

    The font in question is the h2 headers - Akrobat-Black (shown not working on the screenshot attached)

    The code I have used to try to get this to work is

     

    // CUSTOM FONTS

    @font-face {


    font-family: 'akrobat-black';
      
      src: url(https://static1.squarespace.com/static/65534bd6e534764e6fc121e0/t/65aadd6d15ea08067a830f7f/1705696622007/Akrobat-Black.ttf),
           url(https://static1.squarespace.com/static/65534bd6e534764e6fc121e0/t/65aadd685356a53afcae1cc0/1705696616605/Akrobat-Black.otf),
           url(https://static1.squarespace.com/static/65534bd6e534764e6fc121e0/t/65aadd7975ded36bbb021102/1705696634015/Akrobat-Black.woff),
           url(https://static1.squarespace.com/static/65534bd6e534764e6fc121e0/t/65aadd79d6807d2f11c8fd66/1705696634028/Akrobat-Black.woff2),

      url(https://static1.squarespace.com/static/65534bd6e534764e6fc121e0/t/65aadd79e8c4c907ed4e3223/1705696634009/Akrobat-Black.eot);

    }

     

    h2 {

    font-family: 'akrobat-black'!important;
    font-size:30px;
    text-transform:uppercase;
    line-height:35px;

    }
     

    Many thanks in advance

    Will

     

     

     

     

    Screenshot 2024-01-23 at 09.19.20.png

  5. Site URL: https://www.bokafood.co.uk

    Hi There

     

    I was hoping someone might be able to help me on how to add feefo reviews to our squarespace site, I have searched everywhere and cant seem to find any solution. This link explains how to add to a typical site but Im really not sure how this would be applied to squarespace

     

    https://support.feefo.com/support/solutions/articles/8000082218-on-page-reviews#:~:text=To install your On-page,tag as possible.&text=You can easily add your,by following the format below.

×
×
  • 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.