open the social media in new window

• 

  acupunctureinkeighley · Member · Oct 12, 2014 at 3:23 pm

  • Copy link
  • Add topic to favorites

  I add some social media icon on the footer. I would like to open the links to a new window.

  Anyone could help me ?

  Thanks

  The blog I need help with is: (visible only to logged in users)

• 

  timethief · Member · Oct 12, 2014 at 3:27 pm

  • Copy link

  See here http://onecoolsitebloggingtips.com/2013/05/20/creating-html-hyperlinks-links-in-wordpress/ and scroll down to “How to set links to open in a new window”.

• 

  acupunctureinkeighley · Member · Oct 12, 2014 at 3:31 pm

  • Copy link

  the icon was in the footer area, i insert them by adding a group of code, that is the reason i do not know how to link them to new window.

  I know how to link to a new window in a post or text.

• 

  timethief · Member · Oct 12, 2014 at 3:33 pm

  • Copy link

  A link is a link is a link and there is no difference with regard to where they are situate when it comes to the code for opening them in a new window. Change your code for each link in the text widget accordingly.
  This is the general link model (link to open in a new window):
  <a href="URL HERE" target="_blank">TEXT HERE</a>

• 

  acupunctureinkeighley · Member · Oct 12, 2014 at 3:44 pm

  • Copy link

  the code i am using is like below, how can i change to link the icon to new window? thanks

  <div> <img title=”Twitter” src=”https://acuplus.files.wordpress.com/2014/10/twitter.png” alt=”Twitter” width=”35″ height=”35″ /> <img title=”Facebook” src=”https://acuplus.files.wordpress.com/2014/10/facebook.png” alt=”Facebook” width=”35″ height=”35″ /> <img title=”Instagram” src=”https://acuplus.files.wordpress.com/2014/10/instagram.png” alt=”Instagram” width=”35″ height=”35″ /> <img title=”Google” src=”https://acuplus.files.wordpress.com/2014/10/googleplus.png” alt=”GooglePlus” width=”35″ height=”35″ /></div>

• 

  acupunctureinkeighley · Member · Oct 12, 2014 at 3:45 pm

  • Copy link

  `<div> <a href=”https://twitter.com/acuherbkeighley”><img title=”Twitter” src=”https://acuplus.files.wordpress.com/2014/10/twitter.png” alt=”Twitter” width=”35″ height=”35″ /></a> <a href=”https://www.facebook.com/acupuncture.clinic.keighley”><img title=”Facebook” src=”https://acuplus.files.wordpress.com/2014/10/facebook.png” alt=”Facebook” width=”35″ height=”35″ /></a> <a href=”http://instagram.com/acuandherbs”><img title=”Instagram” src=”https://acuplus.files.wordpress.com/2014/10/instagram.png” alt=”Instagram” width=”35″ height=”35″ /></a> <a href=”https://plus.google.com/116816985791852135383/about?hl=en”><img title=”Google” src=”https://acuplus.files.wordpress.com/2014/10/googleplus.png” alt=”GooglePlus” width=”35″ height=”35″ /></a></div>

• 

  hallluke · Member · Oct 12, 2014 at 3:55 pm

  • Copy link

  Every time you see an anchor tag:

  <a ...>

  you need to make sure as well as an href attribute it also includes a target attribute set to “_blank”. Your first link would then look like this:

  <a href="https://twitter.com/acuherbkeighley" target="_blank"><img title="Twitter" src="https://acuplus.files.wordpress.com/2014/10/twitter.png" alt="Twitter" width="35" height="35" /></a>

  If you add the:

  target="_blank"

  bit into each link then they will open in a new browser window or tab.

• 

  acupunctureinkeighley · Member · Oct 12, 2014 at 4:14 pm

  • Copy link

  <div>   <a href=“https://twitter.com/acuherbkeighley”
  target=“_blank"> <img title="Twitter" src="https://acuplus.files.wordpress.com/2014/10/twitter.png" alt="Twitter" width="35" height="35" /></a> <a href=“https://www.facebook.com/acupuncture.clinic.keighley”
  target=“_blank"> <img title="Facebook" src="https://acuplus.files.wordpress.com/2014/10/facebook.png" alt="Facebook" width="35" height="35" /></a> <a href=“http://instagram.com/acuandherbs”
  target=“_blank"> <img title="Instagram" src="https://acuplus.files.wordpress.com/2014/10/instagram.png" alt="Instagram" width="35" height="35" /></a> <a href=“https://plus.google.com/116816985791852135383/about?hl=en”
  target=“_blank"> <img title="Google" src="https://acuplus.files.wordpress.com/2014/10/googleplus.png" alt="GooglePlus" width="35" height="35" /></a></div>

  i insert the above code into the text widget area, but when i save, the code changed to the below automatically.

  <div> <a href="//twitter.com/acuherbkeighley”"> <img title="Twitter" src="https://acuplus.files.wordpress.com/2014/10/twitter.png" alt="Twitter" width="35" height="35" /></a> <a href="//www.facebook.com/acupuncture.clinic.keighley”"> <img title="Facebook" src="https://acuplus.files.wordpress.com/2014/10/facebook.png" alt="Facebook" width="35" height="35" /></a> <a href="//instagram.com/acuandherbs”"> <img title="Instagram" src="https://acuplus.files.wordpress.com/2014/10/instagram.png" alt="Instagram" width="35" height="35" /></a> <a href="//plus.google.com/116816985791852135383/about?hl=en”"> <img title="Google" src="https://acuplus.files.wordpress.com/2014/10/googleplus.png" alt="GooglePlus" width="35" height="35" /></a></div>

  what cause that? help!!

• 

  hallluke · Member · Oct 12, 2014 at 4:19 pm

  • Copy link

  I think that’s a case of using the wrong type of quote marks (it probably sounds like I’m making stuff up just to confuse you but keep reading!), the difference between the following angled quotes which are the wrong type:

  “bad”

  and the straight quotes which are the ones you want to use:

  "good"

  If you look back at the example I posted all the quotes are vertical rather than angled, if you get stuck simply copy one of those into the text editor to use!

• 

  acupunctureinkeighley · Member · Oct 12, 2014 at 4:39 pm

  • Copy link

  still not right, after change just like what you said, the link disappeared .

  never mind, it is ok to keep the existing looking.

  thanks everyone.

• 

  acupunctureinkeighley · Member · Oct 12, 2014 at 4:59 pm

  • Copy link

  hi, I tried it again very carefully, now ,it works!!

  thanks you both for your help!