Jump to content

creedon

Circle Member
 View Profile  See their activity

  • Posts

    9,645

  • Joined

  • Last visited

  • Days Won

    80

 Content Type 

Everything posted by creedon

  1. creedon
    You can try something like the following. $( '.eventitem-backlink' ).attr ( 'href', '/workshops' ); This is for a v7 site using a Brine family template. That targets the class of the link. Let us know how it goes.
  2. creedon
    Go to Pages. Hover over your Blog Page and click the gear icon. Click on Advanced. Click on Page Header Code Injection. Let us know how it goes.
  3. creedon
    I'm not seeing scroll bars in unexpected places. I'm on macOS using Chrome. Please post a image of the https://solletix.com/store/womens-raceback page with these scroll bars.
  4. creedon
    Here is a little something that might make the process a little easier. javascript: var itemId = document.querySelector ( 'body' ).getAttribute ( 'id' ).replace ( 'item-', '' ); var title = document.getElementsByClassName ( 'entry-title' ) [ 0 ].textContent; var s = '/* ' + title + ' */ [itemid="' + itemId + '"],'; alert ( s ); First you need to be on a Atlas Map Locations post page. There are two ways you can use the above. You can type it into the address bar and then hit return. Before you hit return make sure the "javascript: " is at the beginning of the code. Some browsers strip that part out as a safety step upon pasting. If you know how to create a bookmark in your browser you can throw the code in there creating what is called a Bookmarklet. The code then can be triggered by selecting the bookmark. The code throws up an alert with the title and item id. You can then copy and paste the dialog content into your CSS. The above code was thrown together quickly only for this site and to help with the above issue.
  5. creedon
    Add the following to Custom CSS. .search-results /* corumbau */ [itemid="5e6179d6f042ba7f2e97e878"], /* esalen */ [itemid="5e617a32f11f6b3cb96f5997"], /* lamu */ [itemid="5e6173c14c8fbf134de4a15d"] { display: none; } This is just some starter CSS you will need to add an entry for each Atlas Map Locations post. For each post you need to get the itemid. View source for each page and look for '<body id="item-'. Be sure that each CSS entry is followed by a comma except the last one. Let us know how it goes.
  6. creedon
    First you will need the business plan or above. Add the following to Settings > Advanced > Code Injection > HEADER. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js" type="text/javascript"></script> For your blog page add the following to Blog Settings > Advanced > Page Header Code Injection. <script> $( ( ) => { $( 'article' ).each ( function ( ) { let $this = $( this ); let $title = $( '.entry-title', $this ); let textAlign = $title.css ( 'text-align' ); $this.prepend ( $title ); $title.css ( 'text-align', textAlign ); } ); } ); </script> Let us know how it goes.
  7. creedon
    There is no built-in setting for the title to be above the image. See Native template. Scroll down to Blog Pages > On individual posts. However with some CSS and Javascript it could be done. Let us know if that is something you want to pursue.
  8. creedon
    Please post the URL of your site. If you've not already done so, please set up a site-wide password. Post the password here and then we can take a look at your issue.
  9. creedon
    I don't have a fix at this time but an observation. When I narrowed the width of my browser window down to mobile proportions I did "see" off screen categories. However my browser also provided a scroll bar so that I could get to the off screen items. I'm on macOS using Chrome. Also same behaviour on Safari.
  10. creedon
    Please give us the URL for your site so we can take a look at your issue. If you've not already done so please set up a site-wide password. Post the password here and then we can take a look at your issue.
  11. creedon
    Add the following to Page Settings > Advanced > PAGE HEADER CODE INJECTION for the page. <style> body:not(.button-style-default).button-style-outline .sqs-editable-button { background-color: #e37262; -webkit-box-shadow: 0 2px 0 0 #dd5340; box-shadow: 0 2px 0 0 #dd5340; color: #fff; font-size: 15px; font-weight: 600; } body:not(.button-style-default).button-style-outline .sqs-editable-button:hover { background-color: #e67e70; } </style> This is for a v7.0 site using the Brine template. If you're not on the business plan or above then add it to Design > Custom CSS, sans the style tag. Let us know how it goes.
  12. creedon
    Test mode is for Stripe only < https://support.squarespace.com/hc/en-us/articles/205811368-Running-test-orders#toc-option-2---use-test-mode--stripe-only- >. For PayPal you need to do a real transaction then refund yourself or cancel the order < https://support.squarespace.com/hc/en-us/articles/205811368-Running-test-orders#toc-option-1---place-an-order-and-refund-yourself >.
  13. creedon
    As a starting point add the following to your CSS. .header-menu.header-menu--folder-list { width: 85%; } .header-menu-nav-folder { overflow-y: hidden; } .header-menu-nav-folder:not( .header-menu-nav-folder--active ) { -webkit-transform: translatex( 75% ); -ms-transform: translatex( 75% ); transform: translatex( 75% ); visibility: hidden; } @media screen and (max-width: 767px ) { .header-menu.header-menu--folder-list { width: 75%; } .header-menu-nav-folder:not( .header-menu-nav-folder--active ) { -webkit-transform: translatex( 65% ); -ms-transform: translatex( 65% ); transform: translatex( 65% ); visibility: hidden; } } This is for a 7.1 site. Let us know how it goes.
  14. creedon
    I'm unable to detect the issue you are seeing. I tried on my iPhone 5 with iOS v10.x. Please tell us more about your Apple device? What is it? iPhone? iPad? What model? What iOS version? What browser are you using? Which version?
  15. creedon
    Here is a crack at the fonts. Add the following to Design > Custom CSS. .header-menu .user-accounts-text-link { font-size: 16px; } .header-menu-nav-folder-content { justify-content: unset; } .header-menu-nav-item a { font-size: 14px; font-weight: 600; padding: 6px; } You can play with the numbers. Let us know how it goes.
  16. creedon
    Ah. Can you give us a search phrase we can use to test on your site to see the issue you are seeing?
  17. creedon
    If I understand what you want correctly, you want the font size to be much smaller on the mobile menu? On the spacing. You want there to be space at the right so that the menu does not cover up the page below? If I have that right, doing that might be difficult. The issue is that on the right side of your site there is a border of white. So making the mobile not take up the whole screen would just reveal white for the most part. Lets work on one issue at a time. Font size first!
  18. creedon
    Ah. This could be an issue with being in edit mode. If you get out of edit mode does the problem with the buttons not stacking go away? After figuring the stacking problem out, we can move on to mobile implementation.
  19. creedon
    Well. Interesting. When I did the code the buttons were vertically stacked. We won't be able to do anything unless you set up a site-wide password again and give me the password.
  20. creedon
    I've updated my previous post with an updated version of the CSS adding rules for mobile.
  21. creedon
    I think we should try another method. When I came up with the CSS I was working with your home page so I didn't take into account the underline. It looks like getting things to line up with just some CSS is tricky. Replace the CSS code I gave with the following. .header-nav-item--divider { padding: 0.1em 0; } Put the following in Settings > Advanced > Code Injection > HEADER. <script src="//ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> Put the following in Settings > Advanced > Code Injection > FOOTER. <script> $( ( ) => { $( '.header-display-desktop .header-nav-item' ) .slice ( 0, -1 ) .after ( '<div class="header-nav-item header-nav-item--divider">' + '|' + '</div>' ); } ); </script> What this is doing is using Javascript, jQuery and some CSS to add the dividers in a way that shouldn't interfere with the underline. Let us know how it goes.
  22. creedon
    Second shot! /* desktop */ .header-nav-folder-item:nth-of-type(12) { border-bottom: 1px solid; padding-bottom: 1em; } .header-nav-folder-item:nth-of-type(13) { padding-top: 1em; } /* mobile */ .header-menu-nav-item:nth-of-type(13) a { display: inline-block; border-bottom: 1px solid; padding-bottom: 1em; } .header-menu-nav-item:nth-of-type(14) a { padding-top: 1em; } This CSS is very specific to your current menu layout. If you change the order of the menu items then you need to update the CSS. If you add another Folder Page and it has as many or more items then it too would pick up this CSS. In that case another way to target the menu you want to style would be needed. Something like .header-nav-item header-nav-item--folder:nth-of-type(n); Let us know how it goes.
  23. creedon
    Sorry I completely missed that requirement. I'd be glad to give it another go. However your site is now private. Please set up a site-wide password. Post the password here and then we can take a look at your issue.
  24. creedon
    Go to Blog Settings > SEO and at the bottom of the dialog there are three options for hiding information from search engines? Is that what you are looking for? Let us know how it goes.
  25. creedon
    This is one way it could be done. Put the following in Design > Custom CSS. .header-nav-folder-item { border-bottom: 1px solid; padding-bottom: 1em; padding-top: 1em; } .header-nav-folder-item:last-child { border-bottom: unset; } You can play with the border style and padding. This is for a 7.1 site. Let us know how it goes.
×
×
  • Create New...

Squarespace Webinars

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

Upcoming Webinars →

Hire a Designer

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

Get Matched →

Support

Community

Developers

Resources