Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

Search the Community

Showing results for tags 'css'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Forum
    • News and Announcements
    • Getting Started With Squarespace
    • Coding and Customization
    • Commerce
    • Feedback on Your Site
    • Images and Videos
    • Pages and Content
    • SEO and Marketing
    • Site Design and Styles

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


About Me


Website


Location

Found 588 results

  1. My logo for my site is white and it doesn't show up on all the pages other then my homepage so I'm trying to find a way to put a color logo on other pages then the home page, http://www.sparkleaders.org/about/ Any help would be very appreciated! Thanks,Amir
  2. Hello everyone. The floating pagination arrows for blog posts present in the Farro template aren't showing up for me in Chrome browsers. It seems like this is a known issue, specifically with these arrow symbols not showing in Chrome, as I believe the arrow referenced here (https://stackoverflow.com/questions/27265831/google-chrome-is-not-showing-arrow-sign) is the same one used for Farro's blog's floating pagination arrows, though I may be wrong. My website is still unpublished, so I can't link it. Has anyone else experienced this issue? Is it possible to replace the default symbols for the Farro template floating pagination arrows in blog posts? Is it possible via css? Below is some code for reference. I believe the red text is the arrow icons specifically. If necessary, I'd like to replace the default arrows with these: Right — https://fontawesome.com/icons/angle-right?style=solid Left — https://fontawesome.com/icons/angle-left?style=solid&from=io. Please let me know if any additional information is needed to solve this issue. Thanks in advance. ———————— FOR REFERENCE ———————— CSS: .tweak-icon-weight-heavy .Icon--caretLarge--left, .tweak-icon-weight-heavy .Icon--caretLarge--right, .tweak-icon-weight-heavy .Icon--caretSmall--left, .tweak-icon-weight-heavy .Icon--caretSmall--right HTML: <nav class="BlogItem-pagination clear BlogItem-pagination--loaded" data-controller="BlogItemPaginationArrows" data-controllers-bound="BlogItemPaginationArrows"> <a href="/home/traveling-with-some-intention" class="BlogItem-pagination-link BlogItem-pagination-link--prev"> <svg class="Icon Icon--caretSmall--left BlogItem-pagination-icon" viewBox="0 0 9 16"> <use xlink:href="/assets/ui-icons.svg#caret-left-small-icon"></use> </svg><!-- --><div class="BlogItem-pagination-content"> <h4 class="BlogItem-pagination-title">BLOG POST TITLE</h4> <div class="BlogItem-pagination-meta"><!-- Author --><span class="BlogItem-pagination-meta-item BlogItem-pagination-meta-item--author">AUTHOR NAME</span><!-- Date --><time class="BlogItem-pagination-meta-item BlogItem-pagination-meta-item--date" datetime="2019-10-11">October <span>11, </span>2019</time></div> </div> </a> <a href="/home/traveling-with-intention" class="BlogItem-pagination-link BlogItem-pagination-link--next"> <div class="BlogItem-pagination-content"> <h4 class="BlogItem-pagination-title">BLOG POST TITLE </h4> <div class="BlogItem-pagination-meta"><!-- Author --><span class="BlogItem-pagination-meta-item BlogItem-pagination-meta-item--author">AUTHOR NAME</span><!-- Date --><time class="BlogItem-pagination-meta-item BlogItem-pagination-meta-item--date" datetime="2019-10-10">October <span>10, </span>2019</time></div> </div><!-- --><svg class="Icon Icon--caretSmall--right BlogItem-pagination-icon" viewBox="0 0 9 16"> <use xlink:href="/assets/ui-icons.svg#caret-right-small-icon"></use> </svg> </a> </nav>
  3. Hello Community, I would like the height of the images on my homepage in desktop view to shrink (https://www.thecigarbible.com/en/home). The current height is perfect for my mobile view but too tall for anything above the mobile breakpoint. Currently I am using the following code to stretch the images on mobile.
  4. I had originally asked this question years ago (here): https://forum.squarespace.com/topic/79514-css-for-rollover-effect-on-image-block-poster/#comment-121074 The selected answer worked really well for awhile. Although it appears the coding has changed and this css blocks the link from being selected. I have tried altering the css any way possible, but I can't seem to target the issue correctly. I had originally thought the z-index may be the issue but targeting the link and changing it's z-index didn't fix the issue either. Any help would be greatly appreciated!
  5. Can somebody please please help me with my website. I am trying to remove the left & right padding of the images on the top of my blog.(Mobile only) I have four blogs in total on my website but I want this modification to only effect two blogs. (https://www.thecigarbible.com/en/newsblog) and (https://www.thecigarbible.com/de/newsblog) I am using the following code to adjust other padding settings on website primarily the homepage: I am facing the complication that when I change the following code, padding is added to both text and images in the blog. I only want to remove the padding on the top image and not the text. If somebody could help or point me in the right direction that would be amazing!
  6. I'm trying to find a solution for a Jones template Limitation. If you have any information please reply. I'm trying to find a way to Customize the Catalog Playlist Embedded in the Jones Template. I've tried to get help from support but they weren't able to assist me any further but they gave me this idea to ask the community. Thanks in advance.
  7. Hi, my website is www.thecigarbible.com On the mobile website I want to remove all left, right and top padding on the image blocks containing the text "Newsfeed" and the one with "Cigar of the month", so that the image block has no padding top, left and right of the mobile screen. I have tried several different options posted on the forum herea but none seem to work right. I am either left with padding at the top, some small padding either left or right or other content blocks on my website are effected. I am using the template: Brine. I would really appreciate some help.
  8. Hello, I have managed to change the H1 of my website to my custom imported font using CCS coding however I cannot change my site title. Wanting to change to font 'better signature' I am using the Foster Design Template. Current coding as attached- what am I doing wrong?
  9. I have a client that needs to do add Tik Tok as a social media link, but would like to have the Tik Tok social media icon instead of the generic link that appears when I add the handle in connected accounts. Any suggestions on how I might grant this wish? Leslie
  10. Hello everyone, how can I modify the following code so the 90 is displayed within a perfect square and in line with everything else.
  11. Looking to remove the banner on just one page of the Jones templates, not all of the pages. The direct link to the post that I am attempting to do this for is here https://www.parleyave.com/geofilters. Thanks in advance!
  12. Hello Squarespace Answers community, I'm working in the Encore template and I would really like to set a background image for one of my pages. I have an image in the background of my info page and a default black background set for the rest of the website. The encore template currently only allows 1 unique background image-on the info page. I looked into other templates and found that it would be best for me to try to work with the Encore template. I contacted Squarespace Customer care and they recommended that I try using Custom CSS. I looked up several tutorials on CSS coding within squarespace and CSS coding in general. I tried to code the image into this one page. Squarespace will not (no matter what I do) show the image on this one page. It seemed like it was not responding to the code, but when I put in the background-color command, squarespace responded no problem. I'm also not getting any error messages with the current code. Could it be that the Encore template background overrides the custom CSS background image? Or maybe the image is stuck behind the default background image I selected for the rest of the site. Is it even possible for me to have an image on one page (other than the info page) in the encore template using Custom CSS? And if so, am I going down the right path to do so? Maybe there's something wrong with my code-or a different code that would work better. Custom CSS code: collection-id-thingy { background-repeat:repeat; background-position: center center; background-size: cover; background-attachment: fixed; background-image: url ('http://a-image-url.jpg'); } Any help at all is appreciated, Thank you, Caleb
  13. I'm wanting to have the images in an "Image block" a specific or adjustable size when in mobile view. Thank you in advance. Attached standard vs mobile view.
  14. Hi, Please could I get some CSS help. The Primary Navigation of the site goes like this: Nice Story - Nice Location - Nice.Green - Nice Shop I am looking to Bold the word "nice" for each of the items. Thank you!! Rob https://pepper-clarinet-ctnt.squarespace.com/
  15. Hi! I just switched up to the Wells template. I want to change the Site Title and Navagation to a custom web font I have been using. I was able to do it to my old template, but that HTML/CSS is not working for this new template. I have the font code: @font-face { font-family: 'Recoleta'; src: url('https://static1.squarespace.com/static/5928e31fe58c62d37df2a7d1/t/5d410d7047ee420001652090/1564544369780/39DCEF_0_0.woff2') format('woff2'), url('https://static1.squarespace.com/static/5928e31fe58c62d37df2a7d1/t/5d410d739a4d4a0001fa3e70/1564544371195/39DCEF_0_0.woff') format('woff'), url('https://static1.squarespace.com/static/5928e31fe58c62d37df2a7d1/t/5d410d63a71ed100016bafe7/1564544355607/Latinotype+-+Recoleta+SemiBold.otf') format('otf'); } but none of the HTML/CSS I have found is working for me. I have tried each of these so far and nothing. (Each at one time, not together.) #headerNav nav a { font-family: 'Recoleta' !important; } .desc-wrapper p > strong { font-family: 'Recoleta' !important; } header h1.site-title { font-family: "Recoleta"; } .has-site-title .Header-branding { font-family: "Recoleta"; } Any help would be appreciated! Thanks!
  16. I'm attempting to round the corners on my images on two different image blocks. Since Squarespace doesn't seem to natively support rounding corners on images, I was going to do some custom CSS work to round them out. I found this blog entry that gave me the script I needed to enter, but I can't actually properly references the images themselves - only the blocks. For example, here's a test case I built. I have two image blocks here, both set to the Poster design. This is on one of the default templates without any major changes, save for swapping out some text. If I hit inspect, the only ID I can find is for the blocks themselves, not the images. I could just be missing it, but this seems to be the only ID that doesn't start with yui (which I was told isn't static and will change every time the page is reloaded). If I reference this ID when I try to round my corners, I end up with this - a rounded image block. (I'm also not sure why every time I go into edit mode, the formatting on my test photos I'm using seem to break but that's a whole 'nother thing) I'm really new to all of this, so it's totally possible I just have the whole thing completely wrong. Anyone got any pointers? Thanks!
  17. Hello! My website is https://mastercarsreview.com/ and I want to have a cool animation on my Blog pages "News" and "Reviews", and the "Gallery" page. I want the blog post to enlarge while hovering and the images set in the Gallery page to enlarge also on hover. Does anyone have an idea about the Custom CSS? Thanks you in advance.
  18. I'm trying to add drop shadows to images in a Summary block. I did it no problem on the Public Reports page using the Grid layout. But when I try it with a List layout on this testing page stuff goes wonky. Here's what I have in the page header code injection: <style> .sqs-block-summary-v2 .img-wrapper { -moz-box-shadow: 0px -2px 15px 0px rgba(0,0,0,0.2); -webkit-box-shadow: 0px -2px 15px 0px rgba(0,0,0,0.2); box-shadow: 0px -2px 15px 0px rgba(0,0,0,0.2); } .sqs-block-summary-v2 .summary-item { overflow: visible; } </style> Screenshots of what the page looks like before and after I added the overflow:visible bit are attached: * Before, the drop shadow is not visible on the top and left of the images. * After, the drop shadows are visible, but the layout goes very wonky. Any suggestions?
  19. Hello, I have this table code that's responsive on another (non squarespace) site: <table class="table_three_cols" style="margin-left: auto; margin-right: auto;"> <tbody> <tr> <td> </td> <td> </tbody> </table> But on SquareSpace the tables aren't responsive and the graphics get squashed... is there any way I can simply change the CSS so as the screen shrinks the table columns drop below each other? Here's the page: https://www.library.co.uk/new-page-2 Dan
  20. I have been trying relentlessly to solve this issue. I am having the hardest time with figuring out how to add a fade in/fade out animation, from page to page upon loading. I am a bare novice to CSS, but have been able to follow steps on other coding CSS tricks. But, for some reason, I have not been able find a successful option for this problem I am having. I am hoping there is a good pure CSS option available, since I am not to familiar with JavaScript. If anyone can please lend me a hand in advising me of the coding and actions to use in this regards, I would be gratefully appreciative... One example of what I am looking for is located on this web page: http://hellowellput.com/ ... That is a perfect example of how I would like it to fade in and out from page to page. I would like to add, the goal is to use animate.css by Daniel Eden, but I'm not sure on how to add or go about using it. Thanks in advance.
  21. I would like to make one of my navigation menu items/titles to look like a button/be highlighted compared to the rest. I am using the om-template. It looks like the attached photo and I would like the DONATE to be in a darker font with a white rectangular background behind it. I would like it to look similarly to the other attached photo where the CONTACT looks like a button. Thank you!
  22. My website www.emergingmethodism.com has an Instagram block on it, with 9 images in the grid. I need it to look the same on mobile as it does on desktop - with 3 rows of 3 images - but I don't know how to write the custom CSS for it.
  23. Hi, I would like to make a slideshow gallery block full screen and I would like to have my site title overlaid on top of it. Does anyone have any suggestions on how to achieve this? Would really appreciate any help whatsoever. Thanks, Henry
  24. Hello, I am looking to adjust a spacer width to be an exact width and it seems to only allow me to change it to their grid? what would be a custom css code to fix this?
  25. Hi, I'm using Brine Template and would like to change my links in the text to bold. I couldn't find it in the settings. I tried this css code: a:link {; font-weight: bold;; } however it changed all my links to bold, not only text blocks, but also links in summary and other blocks, which I don't want. Does anyone know how to make bold links only in the text blocks? Thanks in advance!
×
×
  • Create New...