SmallSitesSarah

March 3

March 1

@tuanphan At a loss.... I have used the solution in this thread for 3-4 websites, but I cannot coax it to work in the footer. On desktop, the logos in the second line of the footer should be centered. Can you help? (www.muldowney.com)

February 29

On 9/10/2023 at 2:32 AM, MikeMorearty said:

Took forever to figure this out:

Commerce > Customer Notifications

General Orders > Order Confirmed

"Edit Email"

Click where it says "[ Add an optional custom message based on product type. ]"

In the right-hand column, see the box that says "If service product, show:" — you can change or remove the text in that box.

THANK YOU! I couldn't find it either. It's not intuitive at all.

August 19, 2023

@creedon New question. Now that this is set up, is it possible to forward a subdomain to each home page? For example, students.heartologypatientadvocacy.com forwards to heartologypatientadvocacy.com/students. I feel like I've read it's not possible, but just checking to see what you think.

August 10, 2023

6 hours ago, creedon said:

Change #000 to rgba( 0, 0, 0, 0.5 )

The 0.5 is where you change the alpha ( opacity ) value. 1 is full opacity and 0 is none.

So. Weird issue... When I add any code other than the default code from Bookafy, everything except the background colors on the site disappears. When I change it back, everything comes back. It doesn't make sense. Any ideas?

August 9, 2023

5 hours ago, creedon said:
Your were on the right track but you had syntax errors in your iframe tag. I also remove the depreciated frameborder attribute.
<iframe src="https://heartland-pfd.bookafy.com/schedule?type=iframe&amp;locale=en" style="box-shadow : 4px 14px #000; height : 525px; width : 100%;"></iframe>
Let us know how it goes.

Can you teach me how to adjust the opacity? It's a little too dark.

August 9, 2023

I'm looking for a way to add a drop shadow to an iframe, and I'm not sure whether I need to add HTML to the iframe or CSS to the block element. I don't see a similar forum thread on this. Does anyone have advice?

www.heartlandpfd-backend.squarespace.com, Password: Heartland

Looking to add a drop-shadow to the iframe scheduler (#block-yui_3_17_2_1_1691528890816_3655).

August 9, 2023

On 8/7/2023 at 5:49 AM, tuanphan said:

left is move item to right a bit

position: relative, you need to declare this to make left, right attribute work

by default you can use left: calc(50% + 30px) means move to right 50% + 30px

but when you add calc code to CSS, it won't able to read this calc symbol, and you need to add ~ and " symbol

Thank you for explaining!

August 6, 2023

On 8/4/2023 at 7:11 AM, tuanphan said:

Use this code to Custom CSS box

/* Center list item */
@media screen and (min-width:768px) {
/* LARSO Staff */
.user-items-list-item-container[data-section-id="64cab926f07fd41f66a3731b"] li:nth-child(n+4) {
    left: calc(~"50% + 30px");
    position: relative;
}
/* Friends of LARSO */
.user-items-list-item-container[data-section-id="64cac35a9ed23354cccd43de"] li:nth-child(n+7) {
    position: relative;
    left: calc(~"100% + 60px");
}}

Fabulous. Thank you! Can you explain the calc(~# + #px) code? I want to learn how it works in case the number of bios changes. I understand the rest.

August 3, 2023

2 hours ago, tuanphan said:

I don't see team section. Can you share link to an exact page?

Yes! Here you go: https://larso-backend.squarespace.com/about-larso

August 2, 2023

@tuanphan I am having the same issue. I've tried adjusting the section ID and nth child, as suggested in your other posts, but I haven't been able to get the desired result. The bottom row of each "team" section should be centered. Site: larso-backend.squarespace.com, password: LARSO

creedon · July 23, 2023

On 7/21/2023 at 9:28 PM, creedon said:
I'll try to simplify. In the code I showed that has the syntax error, change...
img');<style>
...to...
img');</script><style>
This should close the script tag properly.

When you do have a syntax error like you have/had, all kinds of weird rendering issues are possible.

Thank you for explaining that. I don't know how I missed it!

July 21, 2023

29 minutes ago, creedon said:
You've put the style tag inside a script tag which is a syntax error. Take the style tag out of the script tag.
<script>
const images = document.querySelectorAll('.kg-image-card img, .kg-gallery-card img');<style>

  .passthrough-link:after {
  
    content : unset;
    
    }
    
  </style>
You also need to have a closing tag for the script tag.

I must still be doing something wrong...

July 21, 2023

On 8/22/2022 at 12:04 PM, creedon said:
Add the following to Blog Settings > Advanced > Page Header Code Injection for the blog page. Please see per-page code injection.
<style>

  .passthrough-link:after {
  
    content : unset;
    
    }
	
  </style>
This is for v7.1.

Let us know how it goes.

This stopped working for me for some reason... Any idea why? larso-backend.squarespace.com, pw LARSO.

tuanphan · July 21, 2023

3 hours ago, tuanphan said:

It shows fine to me

I ended up buying the Ghost plugin, "Balance Summary Block." I usually don't pay for something like that, but I have to say, it works beautifully and was only $30 to use forever.

I paired that with the "Lightbox anything" plugin from SqSp themes, and the result is exactly what I wanted. I didn't want senior citizens to have to do a gazillion clicks to get the information they want.

creedon · July 19, 2023

21 hours ago, creedon said:

You need to remove, make a copy somewhere or comment out your custom CSS that is hiding things.

    <style>
      .header-nav-item:nth-child( 3 ) {
        display : none;
      }

      .header-nav-item:nth-child( 4 ) {
        display : none;
      }

      .header-nav-item:nth-child( 5 ) {
        display : none;
      }

      .header-nav-item:nth-child( 6 ) {
        display : none;
      }

      .header-nav-item:nth-child( 7) {
        display : none;
      }
    </style>

I totally forgot I had injected that code into the header of my pages. Thank you!

July 19, 2023

@tuanphan This code worked for me, except the button is covering the text. Can you help me fix that?

URL: larso-backend.squarespace.com, password: LARSO

On 1/5/2022 at 11:40 PM, tuanphan said:
For future comment

Use this code (Design > Custom CSS)
.summary-excerpt a {
    background-color: #c79f00 !important;
    color: white !important;
    font-size: 13pt;
    padding: 5px 10px;
    text-decoration: none;
}

July 18, 2023

@creedon Thanks so much for your 1:1 help! Question: I added another page (/seniors/about-us), but it's not showing in the senior page nav. Can you help?

July 13, 2023

10 hours ago, creedon said:

The Brad Good code is an excellent launch point to get to where you want to go.

Please see the following.

If you think it will work for you respond back here.

Thanks so much for responding @creedon and @paul2009! Yes, I agree the Brad Good code is the best solution. My coding knowledge stops with CSS, so I'm not sure how to make it work for me. Can you help?

paul2009 · July 13, 2023

URL: https://heartology-backend.squarespace.com/ Password: Heartology

My client has three distinct types of audiences and wants different experiences for each. The navigation items need to change depending on which kind of customer is viewing the site.

I’m using code to hide or unhide nth child nav items on desktop and mobile, but it is extremely clunky and sometimes breaks formatting on other parts of the pages. I wonder whether I can achieve a solution using a method similar to what others have used for multi-lingual sites like this instructional page or this forum question.

The mock-up landing page looks like this:

Each audience should see different headers in the navigation. I used these paths and would like to show/hide the correct items according to the audience.

/seniors

/students

/physicians

Tagging @tuanphan @paul2009 and @creedon as I can see you’ve addressed similar questions in other posts, though I can't find the exact answer I'm looking for. Thanks in advance for any ideas you have!

July 4, 2023

22 minutes ago, SmallSitesSarah said:

Bump. I'm having the exact same problem as well. The first click stops way before the anchor. On the second click, it scrolls to the correct place on the page.

For posterity: I removed the code for smooth scroll, and the jump links goes to the right place on the first click now. Just without the nice scrolling effect.

July 4, 2023

Bump. I'm having the exact same problem as well. The first click stops way before the anchor. On the second click, it scrolls to the correct place on the page.

June 14, 2023

On 6/12/2023 at 12:05 AM, creedon said:

Please post the URL for a page on your site where we can see your issue.

A link to the backend of the your site won’t work for us, i.e. a url that contains /config/.

Please set up a site-wide password, if your site is not public and you've not already done so.

Post the password here.

Adding a site-wide password does not allow anyone to alter your site. It only allows those with the password to see your site.

Please read the site-wide password and how to share a link documentation to understand how they work.

We can then take a look at your issue.

You may find How to post a forum question post useful.

Whoops. Just added it: https://www.affabletax.com/

June 11, 2023

Hi! I have simple list with items that rotate on hover. However, I cannot figure out how to round the corners. I added {border-radius: 10px} to the code but it doesn't seem to be working. Has anyone had luck with this? The site is https://www.affabletax.com/. The code I'm using is:

//list rotate on desktop//
section[data-section-id="645002e96aefb16311b13bbc"] {
@media only screen and(min-width:640px){
 .list-item-content {
   transform:rotateY(180deg);
   transition: all .5s;
   margin-top:-65%;
   padding-bottom:30%!important;
   padding:1rem;
   border-radius: 10px;
   opacity:0;
  }
  .list-item:hover  .list-item-content {
   transition: all .5s;
   transform:rotateY(0deg);
   opacity:1;
   border-radius: 10px;
  }
  .list-item-media img{
   transform:rotateY(0deg);
   transition: all .5s;
 }
 .list-item:hover  .list-item-media img{
   transition: all .5s;
   transform:rotateY(180deg);
   opacity:0
  }
  .list-item:hover  .list-item-media{
     transition: all .5s;
     transform:rotateY(180deg);
     background-color:#2AB4F7
  }
}
}

tuanphan · May 25, 2023

On 5/22/2023 at 8:55 AM, NoName said:

+1

On 12/22/2022 at 1:23 PM, Bewarenana said:

Hi @tuanphan, I'm also interested in solution 1 please 🙂

6 hours ago, tuanphan said:
First, download this whatsapp image > upload to your site

Next, Add to Settings > Advanced > Code Injection > Footer

Replace 0123...89 with your whatsapp number
<a href="https://wa.me/0123456789" target="_blank" class="tp-whatsapp"><img src="/s/w.png"></a>
<style>
  a.tp-whatsapp {
    position: fixed;
    right: 10px;
    bottom: 10px;
    z-index: 9999;
}
  a.tp-whatsapp img {
    max-width: 50px;
}
</style>

Thanks! Tip for those of us that use the basic subscription and can't inject code: I found this free Get Button widget. You can see an example on my website. Go to your footer and insert an "Embed" block. Then go to "Code Snippet" and paste this code.

<!-- GetButton.io widget -->
<script type="text/javascript">
    (function () {
        var options = {
            whatsapp: "YOUR NUMBER WITH HYPHENS", // WhatsApp number
            call_to_action: "Message us", // Call to action
            button_color: "#FF6550", // Color of button
            position: "right", // Position may be 'right' or 'left'
        };
        var proto = 'https:', host = "getbutton.io", url = proto + '//static.' + host;
        var s = document.createElement('script'); s.type = 'text/javascript'; s.async = true; s.src = url + '/widget-send-button/js/init.js';
        s.onload = function () { WhWidgetSendButton.init(host, proto, options); };
        var x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x);
    })();
</script>
<!-- /GetButton.io widget -->

Forums

Gallery

Blogs

Events

Store

Downloads

Profiles

Posts posted by SmallSitesSarah

Squarespace Webinars

Hire a Designer

Support

Community

Developers

Resources