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

How can I move/add social icons to top right header? Using Wexley.


ontodont

Question

Site URL: https://www.nickdavid.co.uk/

Hi, I am working on a site which is using Wexley as its base template. The default social icons are only available on the bottom footer where I can move them left/right/center.

I wish there was a way to move the footer block to the top right of the site  above the header text or alternatively add new set of social icons to the top right of the site. If someone know a good way to insert some code to fix this that would be very helpful. 

I have attached images for what I am talking about.

This only is required to work on the desktop version. 

Thanks for the help

Screen Shot 2021-02-26 at 14.19.27.jpg

Screen Shot 2021-02-26 at 14.19.19.jpg

Edited by ontodont
Link to post
  • Answers 3
  • Created
  • Last Reply

Top Posters For This Question

Popular Days

Top Posters For This Question

Posted Images

3 answers to this question

Recommended Posts

  • 0

Thank you @Derricsrandomviews,

but unfortunately I get stuck as far in as secondary navigation, as the Squarespace template does not appear to have that activated which I guess is key for this to work? I belive this is a feature they removed from 7.1 onward?

 

Please let me know if its still a possible way to go around this. 

Thank you

Link to post
  • 0

Add the following to Design > Custom CSS.

.site-alignment-left.header-navigation-split .main-nav {

  margin-right : 0;
  
  }

#socialLinks {

  display : inline-block;
  margin-top : 40.5px;
  
  }

Add the following to Settings > Advanced > Code Injection > HEADER.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

Add the following to Settings > Advanced > Code Injection > FOOTER.

<script>

  $( ( ) => {
  
    /*
    
      move footer social icons to header
      
      SS Version : 7.0
      Template : Wexley
      
      */
      
      $( '#socialLinks' ).appendTo ( '#topNav' );
      
    } );
    
  </script>

Let us know how it goes.

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

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