Hyperlink Icons

Hi,

I’m pretty much a total novice at this but so far I’ve found X Theme super easy to use! One thing I can’t get is how to hyperlink the icons! My site is bbqfest.uk, and at the bottom of the homepage I want to have hyperlinked icons to social media and an email. Could you please let me know how to do this?

Thanks!

Hi @BEDifferentEvents,

Thanks for writing in.

There are a lot of ways on how to add link to the icons. As of now, there are no options in cornerstone to add link directly however you could try the easiest way, via Script. You can follow the link below on how to do this.

Hope it helps. Let us know how it goes.

Thanks. :slight_smile:

Hi Nico,

Thanks for the pointer. I’ve added the following to the custom javascript, but it’s now piling the 4 icons on top of each other. Are you able to advise how I can fix this so they read from left to right?

jQuery(document).ready(function($){
	$("#facebook-column").wrap('<a href="https://www.facebook.com/BBQFestUK/" />');
  $("#twitter-column").wrap('<a href="https://twitter.com/BBQFestUK" />');
  $("#instagram-column").wrap('<a href="https://www.instagram.com/bbqfestuk/" />');
	$("#mailto-column").wrap('<a href="mailto:[email protected]" />');
});

Hi There,

Please, instead of using Jquery, try to use html.

You can do by adding the code

<a href="#"> ICON SHORTCODE </a>

You have a list of the icons shortcode here : http://demo.theme.co/integrity-1/shortcodes/icons/

Hope it helps

Hi Joao,

Thanks for the reply, as I mentioned above, bit of a beginner here! Where do I put the code and do I replace the # with the hyperlinks?

Thanks

Hi There,

You can add the code to a text element, or to a Raw Code Element, Custom Headline…any element that takes html code…

Yes you will replace the # with he links.

Hope it helps!