• Skip to main content
  • Skip to primary sidebar

Ryan McCormick

Dedicated Dad, Software Engineer and Lover of Coffee

Add Twitter Follow Button to Left Side of Website

February 1, 2011 by Ryan McCormick Leave a Comment

Add Twitter Follow Button to Left Side of WebsiteTwitter is a popular service that helps people deliver real-time mass communications. If you have a blog or website and a Twitter account, why not make it easy for your visitors to follow you?

Included in this tutorial is: simple HTML code for your site (html and text file), and two follow images.

Download the file pack from here (right-click and save-as): Twitter Button Files

For your reference, here is the code:
<div style=“border: 0pt none; position: fixed; top: 220px; left: 0pt;”><a href=“http://twitter.com/ntechcomm”><img style=“border: 0;” src=“images/twitterblue.png” alt=“Follow Us on Twitter” /></a></div>

Modify the code for your site:
Change the Twitter link to your username: http://twitter.com/yourusername
Change the image path: Upload the follow images to your site. If your site pages are in the directory root and you have a ‘/images’ folder, the current path will work. Otherwise, use the full path to your follow image: http://www.yoursite.com/images/twitterblue.png

How to use the follow button code on your website:
To use this code on your website, you must place this code immediately following the start <body> tag on every page you wish to display your Twitter follow button.

How to use the follow button code on a hosted WordPress blog:

  • Make sure to backup your WordPress template before making any changes.
  • Upload the follow button images to your site and note the location.
  • After you have uploaded the follow images and have determined the full file path – browse to the wordpress templates folder and find the header.php file of your current blog template.
  • Paste the follow button code immediately following the opening <body> tag.
  • Depending on how you decided to edit your header.php file, either save your changes or upload and replace with your new header.php file.
  • Open your web browser of choice and surf to your blog.
  • If you only see text without an image, double check your image file path settings.
  • If you don’t see anything at all, make sure that your button code has been saved to your template’s header.php file.

Please comment with any questions.

Related

Filed Under: Web Development Tagged With: button, follow, left side of website, twitter

Reader Interactions

Leave a Reply Cancel reply

Primary Sidebar

Recent Posts

  • Force Quit Kill all Chrome Windows MacOS
  • SOLVED: Angular 6 CLI Karma Stuck in Single Run | Karma Stops Running
  • How to Manually Install Java 8 on Ubuntu 18.04 LTS
  • Remove VirtualBox from Ubuntu 16.04 Xenial
  • Clear all Node Modules Folders Recursively Mac/Linux

Recent Comments

  • KKV on Webstorm adding spaces between imports and braces | JavaScript and TypeScript
  • jusopi on Clear all Node Modules Folders Recursively Mac/Linux
  • Qaisar Irfan on Clear all Node Modules Folders Recursively Mac/Linux
  • mustafa on Remove VirtualBox from Ubuntu 16.04 Xenial
  • Pourya on How to Manually Install Java 8 on Ubuntu 18.04 LTS

Archives

  • May 2019
  • May 2018
  • April 2018
  • March 2018
  • January 2018
  • September 2017
  • August 2017
  • July 2017
  • June 2017
  • March 2017
  • December 2015
  • November 2015
  • July 2015
  • April 2015
  • February 2015
  • September 2014
  • June 2014
  • May 2014
  • April 2014
  • March 2014
  • February 2014
  • October 2013
  • August 2013
  • June 2013
  • April 2013
  • March 2013
  • February 2013
  • December 2012
  • October 2012
  • September 2012
  • August 2012
  • July 2012
  • May 2012
  • March 2012
  • February 2012
  • December 2011
  • November 2011
  • April 2011
  • March 2011
  • February 2011
  • January 2011
  • December 2010
  • November 2010
  • August 2009
  • July 2009
  • May 2009

Categories

  • Angular
  • Angular 2
  • AngularJS (1x branch)
  • Computer Q&A
  • ES2015
  • Internet Marketing
  • Javascript
  • Job Interviews
  • Job Search
  • Karma
  • Laravel
  • Linux
  • Linux/Unix Tips
  • MacOS
  • Microsoft Access
  • Microsoft Excel
  • Microsoft Outlook
  • Microsoft Word
  • News
  • Node
  • Open Source
  • PHP
  • Protractor
  • Resume Writing
  • Spring Boot
  • SQL
  • Ubuntu
  • VBA
  • VBScript
  • VirtualBox
  • Web Development
  • Windows Tips
  • Wordpress

Meta

  • Log in
  • Entries feed
  • Comments feed
  • WordPress.org

Copyright © 2023 · Magazine Pro on Genesis Framework · WordPress · Log in

 

Loading Comments...