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

Changing header button based on language


melina

Question

Site URL: https://studiosbythesea.squarespace.com/

Hello, 

I have set up a multisite page and would like the text on the button on the header to change depending on the language. I realize that this requires some kind of if/conditional statements to be created.. Any one have any advice/tips? 

(PW to site is louli)

I would also like to create a similar thing for the footer (right now its a very simple footer with 2 text blocks)

Thanks in advance!  

Link to post
  • Answers 9
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

You can try to make the last menu item become cta button instead, add 2 buttons for 2 language .header-nav-item.lang-gr:last-child a, .header-nav-item.lang-en:last-child a{ color: #fff !

Site URL: https://studiosbythesea.squarespace.com/ Hello,  I have set up a multisite page and would like the text on the button on the header to change depending on the language. I realize that

Hi bankank36! Thanks for your response. This code didn't work when I inserted it into the Header code injection.. Any suggestions?   

Posted Images

9 answers to this question

Recommended Posts

  • 0
57 minutes ago, melina said:

Site URL: https://studiosbythesea.squarespace.com/

Hello, 

I have set up a multisite page and would like the text on the button on the header to change depending on the language. I realize that this requires some kind of if/conditional statements to be created.. Any one have any advice/tips? 

(PW to site is louli)

I would also like to create a similar thing for the footer (right now its a very simple footer with 2 text blocks)

Thanks in advance!  

You can try to make the last menu item become cta button instead, add 2 buttons for 2 language

image.thumb.png.6bacf156f50ef0396a80e560f7568f34.png

.header-nav-item.lang-gr:last-child a,
.header-nav-item.lang-en:last-child a{
    color: #fff !important;
    background-color: #468fa2;
    border-color: #468fa2;
    padding: .6em 1.6032em;
    font-size: calc(0.9rem);
    position: relative;
    top: -5px
}

 

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement, Enable Pinch/Zoom on lightboxGeolocation Automatic Currency Converter, Sortable Table from GSheet
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to post
  • 0
On 12/19/2020 at 5:13 PM, bangank36 said:

You can try to make the last menu item become cta button instead, add 2 buttons for 2 language

image.thumb.png.6bacf156f50ef0396a80e560f7568f34.png


.header-nav-item.lang-gr:last-child a,
.header-nav-item.lang-en:last-child a{
    color: #fff !important;
    background-color: #468fa2;
    border-color: #468fa2;
    padding: .6em 1.6032em;
    font-size: calc(0.9rem);
    position: relative;
    top: -5px
}

Thank you! Do I inject this as header code? I added it there and it didnt seem to do anything. 

 

 

Link to post
  • 0
On 12/21/2020 at 12:42 PM, melina said:

 

Hi bankank36! Thanks for your response. This code didn't work when I inserted it into the Header code injection.. Any suggestions? 

On 12/19/2020 at 5:13 PM, bangank36 said:

You can try to make the last menu item become cta button instead, add 2 buttons for 2 language

image.thumb.png.6bacf156f50ef0396a80e560f7568f34.png


.header-nav-item.lang-gr:last-child a,
.header-nav-item.lang-en:last-child a{
    color: #fff !important;
    background-color: #468fa2;
    border-color: #468fa2;
    padding: .6em 1.6032em;
    font-size: calc(0.9rem);
    position: relative;
    top: -5px
}

 

 

Link to post
  • 0
7 hours ago, melina said:

Hi bankank36! Thanks for your response. This code didn't work when I inserted it into the Header code injection.. Any suggestions? 

 

have you add 2 links like suggested?

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement, Enable Pinch/Zoom on lightboxGeolocation Automatic Currency Converter, Sortable Table from GSheet
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to post
  • 0
16 hours ago, bangank36 said:

have you add 2 links like suggested?

Hi! No, I haven't.. Where does it go exactly.. Is it something like this (This didn't work either so I imagine Im doing something wrong. 

.header-nav-item.lang-gr:last-child <a href="https://limanakistudios.squarespace.com/gr/kante-kratisi"></a>
.header-nav-item.lang-en:last-child <a href="https://limanakistudios.squarespace.com/en/book-your-stay"></a>
    color: #fff !important;
    background-color: #468fa2;
    border-color: #468fa2;
    padding: .6em 1.6032em;
    font-size: calc(0.9rem);
    position: relative;
    top: -5px
}

Link to post
  • 0
5 hours ago, melina said:

Hi! No, I haven't.. Where does it go exactly.. Is it something like this (This didn't work either so I imagine Im doing something wrong. 

.header-nav-item.lang-gr:last-child <a href="https://limanakistudios.squarespace.com/gr/kante-kratisi"></a>
.header-nav-item.lang-en:last-child <a href="https://limanakistudios.squarespace.com/en/book-your-stay"></a>
    color: #fff !important;
    background-color: #468fa2;
    border-color: #468fa2;
    padding: .6em 1.6032em;
    font-size: calc(0.9rem);
    position: relative;
    top: -5px
}

No.

Just copy the code i sent as it was, no modified.

And then add the 2 link to your navigation

In short, the code will turn any last link in the naviagtion into button look and feel

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement, Enable Pinch/Zoom on lightboxGeolocation Automatic Currency Converter, Sortable Table from GSheet
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to post
  • 0

Sorry, Im still not understanding. 

The 2 links to my navigation should  be added where? They are on the website, yes. Should they be added to the code somewhere? When I add teh code as is, it doesn't work. 

3 hours ago, bangank36 said:

No.

Just copy the code i sent as it was, no modified.

And then add the 2 link to your navigation

In short, the code will turn any last link in the naviagtion into button look and feel

 

Link to post
  • 0
6 hours ago, melina said:

Sorry, Im still not understanding. 

The 2 links to my navigation should  be added where? They are on the website, yes. Should they be added to the code somewhere? When I add teh code as is, it doesn't work. 

 

Add the code to Design->Custom Css, it will automatically turn the last link in the navigation into a button look-and-feel. Your site is deleted btw

.header-nav-item.lang-gr:last-child a,
.header-nav-item.lang-en:last-child a{
    color: #fff !important;
    background-color: #468fa2;
    border-color: #468fa2;
    padding: .6em 1.6032em;
    font-size: calc(0.9rem);
    position: relative;
    top: -5px
}

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement, Enable Pinch/Zoom on lightboxGeolocation Automatic Currency Converter, Sortable Table from GSheet
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to post
  • 0
On 12/19/2020 at 9:15 PM, melina said:

Site URL: https://studiosbythesea.squarespace.com/

Hello, 

I have set up a multisite page and would like the text on the button on the header to change depending on the language. I realize that this requires some kind of if/conditional statements to be created.. Any one have any advice/tips? 

(PW to site is louli)

I would also like to create a similar thing for the footer (right now its a very simple footer with 2 text blocks)

Thanks in advance!  

How are you holding up? I seeing the site has been closed

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement, Enable Pinch/Zoom on lightboxGeolocation Automatic Currency Converter, Sortable Table from GSheet
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...