Jump to content

christyprice

Circle Member
  • Posts

    973
  • Joined

  • Last visited

  • Days Won

    8

Everything posted by christyprice

  1. This should be possible with Custom CSS, but the exact code depends on the template you are using. If you can share the link to your site with password, someone can probably help out.
  2. @camilla.ciappina, As with the site above, you’d likely need to have someone log in as an admin to check your code and your images.
  3. @BRepairers, it's hard to know without seeing your code and images. It might be an issue with the mobile breakpoints. Double check those.
  4. Hi @BOwens, As @tuanphan mentioned the code is specific to each template family. If you happen to be on a Brine family template, you can add this code in that particular page's Page Settings > Advanced > Page Header Code Injection to remove the announcement bar. If you are on a different template, please post a link to your site so someone can help you out. <style> /* remove announcement bar */ .sqs-announcement-bar-custom-location { display: none !important; } </style>
  5. Your best bet would be the Universal Filter plugin: https://www.squarewebsites.org/products/universal-filter
  6. @justinpheap.co I use one Home index page. Within that index I have one subpage for desktop view and one subpage for mobile that I show/hide with the code above.
  7. @justinpheap.co, I use index pages and just hide/show the subpages, so the page URL stays the same.
  8. @Chira, that looks fantastic! Great job and so glad I could help. ☺️
  9. You could use this code when targeting your specific button class in Custom CSS - just change out the colors: https://codepen.io/miraviolet/pen/ZobWEg
  10. @lindseyturner, exactly. You can use the Chrome extension Squarespace Collection/Block Identifier that JonJonJon mentioned above to easily discover and copy the block-id. Then you can change the font size from 20 to whatever works for you.
  11. You'd want to target that specific block for mobile only in Design > Custom CSS. Try this and play around with the font size. @media screen and (max-width: 640px) { #block-b804c57f124fbfbe2d7f { font-size: 20px !important; } }
  12. To do that, you'll need to recreate the entire line of social media icons as a code block using FontAwesome. You'll include the Font Awesome code in your site code injection as detailed in this post, then in a code block add the code for the icons and links, something like this: <div><a href="mailto:youremailaddress" target="_blank"> <span class="fa fa-envelope"></span></a> <a href="https://yourlink.com" target="_blank"> <span class="fa fa-globe"></span></a> </div>
  13. I second what @BigJosh says. Also, make sure you've connected your Squarespace site in Mailchimp and added that code to Squarespace. You can find the exact steps here.
  14. Sure. For the font color, weight, etc. you can just add those lines in with the code above, so something like this: .sqs-gallery-block-slideshow .meta .meta-title, .sqs-gallery-block-slideshow .meta .meta-description { text-align: center; font-size: 30px; color: #000000; font-weight: 700; } Changing the font, you'd add in a line for font-family: new-font; You'd just want to make sure that font is actually loaded on the site. For the opacity, this adjusts the starting opacity at the bottom to 70%:], but you can play around with the colors and percentages. There's different code for the different rendering engines (-ms is for Internet Explorer, etc.): .sqs-gallery-block-slideshow.sqs-gallery-block-meta-position-bottom .meta { background: -moz-linear-gradient(top,rgba(0,0,0,0) 0%,rgba(30,30,30,.7) 100%); background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(0,0,0,0)),color-stop(100%,rgba(30,30,30,.7))); background: -webkit-linear-gradient(top,rgba(0,0,0,0) 0%,rgba(30,30,30,.7) 100%); background: -o-linear-gradient(top,rgba(0,0,0,0) 0%,rgba(30,30,30,.7) 100%); background: -ms-linear-gradient(top,rgba(0,0,0,0) 0%,rgba(30,30,30,.7) 100%); background: linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(30,30,30,.37) 100%); }
  15. Hi @natejmedia, Try adding this code to Design > Custom CSS: .sqs-gallery-block-slideshow .meta .meta-title, .sqs-gallery-block-slideshow .meta .meta-description { text-align: center; }
  16. This isn’t the unicorn you’re looking for (you have to pay a fee for >25 entries, etc) but it might be worth checking out. community box
  17. ETA: If you are on the newer Squarespace 7.1, this post has a walkthrough: How to Show a Different Banner Image on Mobile in Squarespace Hi @Joeyearthly, If you are using an index page, I have a different workaround that I like a bit better, since you can make whole area specific for mobile instead of just the banner image. I create two "sub-pages" at the top of the index page, one for desktop view (with the URL slug home-banner) and one for mobile view (with the URL slug home-banner-mobile). Then I add the following code to Custom CSS. (Note that if you want to edit the mobile from your desktop, you'll need to briefly comment out the code so you can see that page on desktop.) /* show home page block dependent on screen size */ @media only screen and (max-width: 780px) { #home-banner { display: none; } } @media only screen and (min-width: 781px) { #home-banner-mobile { display: none; } }
  18. Hey @Valentino - I sent you a DM. It's a weird error, so I'm curious!
  19. Thanks @Valentino. I can definitely see the error! When you edit the page, what do you see in that area? Is it trying to pull in part of a page?
  20. The lazy summaries plugin is a third party solution that allows for you to sort the posts in several ways, including oldest to newest. https://www.squarewebsites.org/products/lazy-summaries
  21. Could you both please post links to your sites? That would help us troubleshoot.
  22. Thanks for the link. I had assumed you were using the Project blocks in Avenue and wanting to change those titles. For the way you have it set up, using a gallery grid, you'd need to use code like this, added to Design > Custom CSS: .sqs-gallery-block-grid.sqs-gallery-block-meta-only-title .margin-wrapper .image-slide-title { font-family: futura-pt !important; font-size: 20px !important; line-height: 1.2em !important; text-transform: none !important; letter-spacing: .02em !important; font-weight: 300 !important; font-style: normal !important; color: #404040 !important; } You'll need to change out the values to match your H3. Since I didn't see it used on your site, I can't see what values you are using, so just replace the sizes and colors with whatever you want.
  23. Hi @cakalak, You'd add something like this to Design > Custom CSS. Delete the lines you don't need, and change the font-family, font-size, etc to match your H3. .project .project-title { font-family: "futura-pt" !important; font-size: 20px !important; line-height: 1.2em !important; text-transform: lowercase !important; letter-spacing: .02em !important; font-weight: 300 !important; font-style: normal !important; color: #404040 !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.