MantaTrust

I have just created a new website in Squarespace named 'maldivesmantaconservation.org', using a domain I purchased through Hover.

This website is managed through the Manta Trust Squarespace account.

Both 'Manta Trust' and 'Maldives Manta Conservation Programme' are registered charities, and work in collaboration, however Manta Trust is the only charity that currently has a free Google Workspace for Non-Profits account. This means that all charity team members of the Manta Trust have an email address like so: name@mantatrust.org.

I want to set up the same thing for Maldives Manta Conservation Programme staff, so that they have email addresses that link to the domain name eg. name@maldivesmantaconservation.org.

When I go to set up a Google Workspace plan for the domain 'maldivesmantaconservation.org' through Squarespace it automatically goes to charge me. So first I need to apply for the Google Workspace for Non-Profits account for Maldives Manta Conservation Programme. However, in order to do this I have to show that I have a google account first. Therefore, do I buy one email account with Google Workspace through Squarespace first?

Currently confused at the steps I need to go through. Thanks in advance.

@inside_the_square amazing thank you!! This has finally fixed the issue for me, after months. Really appreciate it 🙂

Hello @inside_the_square thank you so much for offering your help! I was still at a total loose end so I appreciate it 🙂

I've added your code but it still looks the same 😕 see screenshot attached.

This is my full footer custom CSS for reference, is this all correct? Thanks in advance.

<!-- Container for header CTA buttons --> 
<div class="cta-buttons-container">
  <!-- Donate button --> 
  <a href="/donate" class="cta-button donate">Donate</a> 
  <!-- Join button --> <a href="/the-cyclone" class="cta-button join">Join</a>
</div>

<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-WMKLKCZL"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
@media screen and (max-width: 767px) {
    body.is-mobile-overlay-active .cta-buttons-container {
        display:none !important
    }
    .cta-buttons-container {top:15px; right: 15vw}
}

Hello @tuanphan sorry just following up to see if you have any solution for the issue above? Thanks in advance!

@tuanphan thank you so much that's really helpful! 🙂

I've chosen to hide the buttons when the overlay menu is open only, and it's looking much better. The only slight issue now is the placement of the buttons. They ideally need to shift left and up slightly. Currently, they still overlap the overlay menu and hover on the edge of the header.

Would you be able to provide any code to fix this? Thanks in advance.

Hello, sorry just following up to see if you have any advice on fixing this for mobile use? Our mobile dropdown is currently a bit broken because of it so would love to sort it soon. Thanks so much in advance for your help!

Hello Paul,

Oh amazing, thank you so much for providing that! It looks great on our browser now 🙂 

As you've mentioned, the mobile version looks a bit funky now. The buttons kind of float above the navigation menu. Sorry I know this is a lot of work for you, but I don't suppose you might be able to assist with some coding that would make the buttons mobile friendly too?

I'm very much out of depth with coding so wouldn't know how to fix this myself, and would otherwise need to remove the awesome buttons you have provided as we have so many mobile users.

Let me know if that would be ok. Thanks again for your help!

Hello Paul,

Thanks for getting back to me with your suggestions. I like the look of the CTA buttons on the banner image. However, we would like to have them in the header so that viewers can see the buttons whilst browsing every page on the site.

Just checked the analytics from last year:

Mobile: 58%

Desktop: 40%

We would like to have 2 buttons in the top right corner, with the same look as the buttons we currently have in the footer but with different colours (capitalised font stating 'DONATE' in red and 'JOIN' in orange). I would switch the colouration of the buttons in the footer to match this ('DONATE' in red, 'JOIN' in orange, and 'ADOPT' in yellow).

Donate: https://www.mantatrust.org/donate

Join: https://www.mantatrust.org/the-cyclone

Do you think you would be able to provide some code to create this, and explain the steps to inject it? (Sorry I'm totally new to coding!)

Hello,

We had an audit of our charity website, and it was recommended that we add two coloured buttons above our navigation menus on the website (one to donate to our charity, and another to become a member). See screenshot attached.

I can see there is little flexibility on the Squarespace template sites (we are using system 7.0) to adjust the layout of the navigation area, or add additional buttons.

I'm just wondering if anyone can suggest any custom code to create this? I would probably like to adjust the colour codes slightly, but curious to know first if this is possible.

Thanks!

Hello thanks for sending over the guide, that's very useful!

I would like to reduce our page number. Unfortunately, when I inherited the site, every page is actually an index made up of multiple pages (so that each page could have a different background). The site is on version 7.0 so we can't make different blocks on a page.

It would just take me too long to restructure the whole site sadly 😕 but noted for future reference. Thanks again

Hello,

Thanks for your response. To be honest, I'm just doing this because I've been told it's very important to do (mostly in case the websites got hacked, or another team member accidentally deleted important content).

The charity I work for has never backed up any of the websites, so I thought it would be good to introduce it as a new annual protocol. But do you feel this isn't necessary? Thanks

Hello just wanted to see if anyone could advise on this?

Thanks

Hello,

I am currently in the process of backing up all of websites that I manage for a charity. I have been able to make copies of 5 websites that are less than 100 pages.

However, our 3 main websites are more than 100 pages so I cannot make copies of them. What is the simplest way for me to make copies of the content on these 3 websites?

One of the websites is 500+ pages so I don't want to individually export each page. Is there a way for me to export all of the content in one go? I only really need the written content.

Thanks in advance!

Amazing thanks so much, all sorted! 🙂

Hello thank you,

That has fixed that page but it still hasn't fixed links on font size 'Normal' on other pages. See screenshot attached.

As mentioned, could you please provide code that covers all font sizes? (h1, h2, h3, normal)? 

Thanks in advance

Hello,

Thanks so much! That worked well. However, for smaller font (normal, heading 3, etc.) I still face the same issue.

Can you advise what the code injection would state to cover all font sizes?

Thanks

Thanks for your advice. I tried to edit this in the custom CSS section, but I couldn't find it on my site (I followed the Squarespace tutorial which said it would be under Design).

See screenshot attached. Can you advise? Or let me know where I can find 'website tools'? Thanks

Sorry I forgot to include that, its:

research.mantatrust.org

Thanks in advance for your help

Hello,

I recently updated some of the site styles on the website I am currently building. Before updating, the links within the main content were visible. Now they are no longer visible, even though the link colour is set to a colour that should be visible. The click-through links work, but you cannot see the text at all (see screenshots attached).

How do I resolve this?

Password for website is: Manta2022!

3 minutes ago, creedon said:

You can paste it below your current code. If it doesn't work, you can remove it.

My code has no guarantees. Now or in the future. Once you paste it into your site there is no way I can control what you've done to it or what changes SS will make to their platform that may change how it worked when created. Such is the nature of custom code.

Also this code is pretty old so without being able to see your site there is no way we can know if the code will/can work.

Hello, thanks for getting back to me and for your info. That's good to know that I can remove it if necessary.
I realised it is not actually the newsletter block that I want to change the font for, but instead the email campaign font.
Would you know what code I would use to change the font on the marketing campaigns? Unfortunately their font options for the newsletters are very limited (just 3 fonts available)
Thanks in advance

On 11/10/2020 at 7:11 AM, creedon said:

@marianaalvarado

I've updated the CSS in my previous post.

Let us know how it goes.

On 11/7/2020 at 6:01 AM, creedon said:

@marianaalvarado

Remove (make a copy somewhere) or comment out your previous CSS and add the following to Design > Custom CSS.

.newsletter-block .newsletter-form-header-title {

  font-family: adobe-garamond-pro;
  font-size: 70px;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1em;
  text-transform: none;
  
  }

.newsletter-block .newsletter-form-header-description p {

  font-family: adobe-garamond-pro;
  font-size: 24px;
  line-height: 1.65em;
  
  }

.newsletter-block .newsletter-form-button {

  font-family: din-condensed-web;
  letter-spacing: 0.1em;
  
  }

Let us know how it goes.

Hello, this is very useful thank you. I would like to add the CSS code you have added above to my newsletter, but instead using the font Lato. Can I paste it below my current CSS code, like the picture below?
I want to ensure that this won't damage my site at all. Can I also change the code later without damaging the site?

Thanks in advance