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

URL clickable for Header Element


abry747

Question

Site URL: https://www.deprio.com/home

Hi! I replaced the customer "account" login text link in the header with a font awesome icon.  I want to see if there is a code that can make this icon clickable to go to another page on my site.  I'm using 7.1,  thanks!

 

Here is the code I used in the code injection to create the icon:

<script>
    $(".user-accounts-link").append("<i class='fa fa-user-o' aria-hidden='true'></i>");
</script>

 

And the CSS I used:


.user-accounts-text-link{
  display:none!important;
   }

 

Link to post
  • Answers 4
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

Wrap an <a> tag around your <i> tag in the jQuery.

Give that <a> an id, so <a id="logo" href=...................> The set css a#logo { font-size: unset !important; text-shadow: none !important; }

That worked perfect!  Thank you again!

4 answers to this question

Recommended Posts

  • 0

Wrap an <a> tag around your <i> tag in the jQuery.

Free Squarespace 7.1 Anchor Link and Accordion Plugins available here!

If I replied to one of your questions with code, it was either CSS or jQuery.

To add CSS, go to Design -> Custom CSS

jQuery needs some additional steps. Head here: https://code.jquery.com/ and click on minified, under jQuery 3.x and copy that code into Squarespace.

After you put that code into the code injection section in Squarespace, you can add the code I supplied. The code from me will need <script> added before it and </script> added after it (only for jQuery).

There are two places that you can add the code, one is site wide (adds to all pages). Settings -> Advanced -> Code Injection

The other is for a specific page (adds to one page only). Pages -> Gear Icon next to the page -> Advanced

Link to post
  • 0

That worked! Thanks!..my icon size got smaller, do you know how I can increase the size?  I'm using this css below but it's not changing the size.  Thanks!

 

.user-accounts-link {font-size: 25px !important;}

Link to post
  • 0

Give that <a> an id, so <a id="logo" href=...................>

The set css

a#logo {

font-size: unset !important;

text-shadow: none !important;

}

Free Squarespace 7.1 Anchor Link and Accordion Plugins available here!

If I replied to one of your questions with code, it was either CSS or jQuery.

To add CSS, go to Design -> Custom CSS

jQuery needs some additional steps. Head here: https://code.jquery.com/ and click on minified, under jQuery 3.x and copy that code into Squarespace.

After you put that code into the code injection section in Squarespace, you can add the code I supplied. The code from me will need <script> added before it and </script> added after it (only for jQuery).

There are two places that you can add the code, one is site wide (adds to all pages). Settings -> Advanced -> Code Injection

The other is for a specific page (adds to one page only). Pages -> Gear Icon next to the page -> Advanced

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...