{"id":2208,"date":"2013-01-25T15:30:39","date_gmt":"2013-01-25T15:30:39","guid":{"rendered":"https:\/\/www.inmotionhosting.com\/support\/2013\/01\/25\/sidebar-image-links\/"},"modified":"2021-08-16T23:23:37","modified_gmt":"2021-08-17T03:23:37","slug":"sidebar-image-links","status":"publish","type":"post","link":"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/","title":{"rendered":"How to add images and image links to your WordPress sidebar"},"content":{"rendered":"

The sidebar is a wonderful piece of real estate on your site to place relevant content that may not fit directly on a page or post. Most content in a sidebar is text, however you can certainly add some diversity by making some of those text links into buttons or image links. Adding an image link to your WordPress sidebar is not much different than adding any other meta data. Below is a quick tutorial on how to add image links to your sidebar in your WordPress site.<\/p>\n

Adding image links to your sidebar in WordPress<\/h2>\n
    \n
  1. Log into your WordPress Admin dashboard<\/a>.<\/li>\n
  2. Once logged into the Admin area, look to the left hand menu and click on the Appearance<\/em> menu category. From there, click on the Editor<\/strong> sub-option to continue.<\/li>\n
  3. This brings you to the main Editor<\/em> page for all php and css files for your current theme. Look to the menu on the right-hand side and scroll down until you see the Sidebar<\/strong> option. Click on that link to open the sidebar.php<\/em> file in the editor.
    \n    \"select<\/a>\n
    <\/div>\n<\/li>\n
  4. With the sidebar.php<\/em> file open in the editor, you can edit the code and add your image. The snippet of code below is an image link that points to the XML reference site. Notice the <img> tag uses the URL of an image on the test site. This is an image that was uploaded to the hosting account, which you can do either with the cPanel File Manager<\/a> or by FTP<\/a>. You can also point it to a location on another site if they allow you to do so.
    \n\u00a0\u00a0\u00a0\u00a0 <a href=\"https:\/\/xml.com\"
    \n\u00a0 \u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 title=\"XML Reference Site\">
    \n\u00a0 \u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 <img src=\"https:\/\/wordpress.inmotiontesting.com\/xml.jpg\"
    \n\u00a0 \u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 alt=\"Valid XHTML 1.0!\" \/>
    \n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0<\/a>
    \n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0<br \/><\/code>
    \n    \"adding<\/a>\n
    <\/div>\n<\/li>\n
  5. Once you have entered the code and ensured your image is in the right location, click on the Update File<\/strong> button to save the change and activate the code. Below is a shot of the test site with the XML image link pointing to the XMP site.
    \n    \"image<\/a>\n
    <\/div>\n<\/li>\n<\/ol>\n","protected":false},"excerpt":{"rendered":"

    The sidebar is a wonderful piece of real estate on your site to place relevant content that may not fit directly on a page or post. Most content in a sidebar is text, however you can certainly add some diversity by making some of those text links into buttons or image links. Adding an image Read More ><\/a><\/p>\n","protected":false},"author":8,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[4325,56],"tags":[],"class_list":["post-2208","post","type-post","status-publish","format-standard","hentry","category-wordpress-hosting","category-wordpress"],"acf":[],"yoast_head":"\nHow to add images and image links to your WordPress sidebar | InMotion Hosting<\/title>\n<meta name=\"description\" content=\"Learn to add buttons, images, and imagelinks into your Wordpress sidebar with this article.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to add images and image links to your WordPress sidebar | InMotion Hosting\" \/>\n<meta property=\"og:description\" content=\"Learn to add buttons, images, and imagelinks into your Wordpress sidebar with this article.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/\" \/>\n<meta property=\"og:site_name\" content=\"InMotion Hosting Support Center\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/inmotionhosting\/\" \/>\n<meta property=\"article:published_time\" content=\"2013-01-25T15:30:39+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-08-17T03:23:37+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.inmotionhosting.com\/support\/wp-content\/uploads\/2013\/01\/edu_wordpress_sidebar_nested-list_select-editor.png\" \/>\n<meta name=\"author\" content=\"Scott Mitchell\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@InMotionHosting\" \/>\n<meta name=\"twitter:site\" content=\"@InMotionHosting\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Scott Mitchell\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/\"},\"author\":{\"name\":\"Scott Mitchell\",\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/#\/schema\/person\/d850efb28ef3573db7d24b0d8fa9eaed\"},\"headline\":\"How to add images and image links to your WordPress sidebar\",\"datePublished\":\"2013-01-25T15:30:39+00:00\",\"dateModified\":\"2021-08-17T03:23:37+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/\"},\"wordCount\":328,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.inmotionhosting.com\/support\/wp-content\/uploads\/2013\/01\/edu_wordpress_sidebar_nested-list_select-editor.png\",\"articleSection\":[\"WordPress Hosting\",\"WordPress Tutorials\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/\",\"url\":\"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/\",\"name\":\"How to add images and image links to your WordPress sidebar | InMotion Hosting\",\"isPartOf\":{\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.inmotionhosting.com\/support\/wp-content\/uploads\/2013\/01\/edu_wordpress_sidebar_nested-list_select-editor.png\",\"datePublished\":\"2013-01-25T15:30:39+00:00\",\"dateModified\":\"2021-08-17T03:23:37+00:00\",\"description\":\"Learn to add buttons, images, and imagelinks into your Wordpress sidebar with this article.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/#primaryimage\",\"url\":\"https:\/\/www.inmotionhosting.com\/support\/wp-content\/uploads\/2013\/01\/edu_wordpress_sidebar_nested-list_select-editor.png\",\"contentUrl\":\"https:\/\/www.inmotionhosting.com\/support\/wp-content\/uploads\/2013\/01\/edu_wordpress_sidebar_nested-list_select-editor.png\",\"width\":170,\"height\":333,\"caption\":\"select editor menu option\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.inmotionhosting.com\/support\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to add images and image links to your WordPress sidebar\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/#website\",\"url\":\"https:\/\/www.inmotionhosting.com\/support\/\",\"name\":\"InMotion Hosting Support Center\",\"description\":\"Web Hosting Support & Tutorials\",\"publisher\":{\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.inmotionhosting.com\/support\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/#organization\",\"name\":\"InMotion Hosting\",\"url\":\"https:\/\/www.inmotionhosting.com\/support\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.inmotionhosting.com\/support\/wp-content\/uploads\/2023\/02\/inmotion-hosting-logo-yoast.jpg\",\"contentUrl\":\"https:\/\/www.inmotionhosting.com\/support\/wp-content\/uploads\/2023\/02\/inmotion-hosting-logo-yoast.jpg\",\"width\":696,\"height\":696,\"caption\":\"InMotion Hosting\"},\"image\":{\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/inmotionhosting\/\",\"https:\/\/x.com\/InMotionHosting\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.inmotionhosting.com\/support\/#\/schema\/person\/d850efb28ef3573db7d24b0d8fa9eaed\",\"name\":\"Scott Mitchell\",\"url\":\"https:\/\/www.inmotionhosting.com\/support\/author\/scott\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to add images and image links to your WordPress sidebar | InMotion Hosting","description":"Learn to add buttons, images, and imagelinks into your Wordpress sidebar with this article.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/","og_locale":"en_US","og_type":"article","og_title":"How to add images and image links to your WordPress sidebar | InMotion Hosting","og_description":"Learn to add buttons, images, and imagelinks into your Wordpress sidebar with this article.","og_url":"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/","og_site_name":"InMotion Hosting Support Center","article_publisher":"https:\/\/www.facebook.com\/inmotionhosting\/","article_published_time":"2013-01-25T15:30:39+00:00","article_modified_time":"2021-08-17T03:23:37+00:00","og_image":[{"url":"https:\/\/www.inmotionhosting.com\/support\/wp-content\/uploads\/2013\/01\/edu_wordpress_sidebar_nested-list_select-editor.png","type":"","width":"","height":""}],"author":"Scott Mitchell","twitter_card":"summary_large_image","twitter_creator":"@InMotionHosting","twitter_site":"@InMotionHosting","twitter_misc":{"Written by":"Scott Mitchell","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/#article","isPartOf":{"@id":"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/"},"author":{"name":"Scott Mitchell","@id":"https:\/\/www.inmotionhosting.com\/support\/#\/schema\/person\/d850efb28ef3573db7d24b0d8fa9eaed"},"headline":"How to add images and image links to your WordPress sidebar","datePublished":"2013-01-25T15:30:39+00:00","dateModified":"2021-08-17T03:23:37+00:00","mainEntityOfPage":{"@id":"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/"},"wordCount":328,"commentCount":0,"publisher":{"@id":"https:\/\/www.inmotionhosting.com\/support\/#organization"},"image":{"@id":"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/#primaryimage"},"thumbnailUrl":"https:\/\/www.inmotionhosting.com\/support\/wp-content\/uploads\/2013\/01\/edu_wordpress_sidebar_nested-list_select-editor.png","articleSection":["WordPress Hosting","WordPress Tutorials"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/","url":"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/","name":"How to add images and image links to your WordPress sidebar | InMotion Hosting","isPartOf":{"@id":"https:\/\/www.inmotionhosting.com\/support\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/#primaryimage"},"image":{"@id":"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/#primaryimage"},"thumbnailUrl":"https:\/\/www.inmotionhosting.com\/support\/wp-content\/uploads\/2013\/01\/edu_wordpress_sidebar_nested-list_select-editor.png","datePublished":"2013-01-25T15:30:39+00:00","dateModified":"2021-08-17T03:23:37+00:00","description":"Learn to add buttons, images, and imagelinks into your Wordpress sidebar with this article.","breadcrumb":{"@id":"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/#primaryimage","url":"https:\/\/www.inmotionhosting.com\/support\/wp-content\/uploads\/2013\/01\/edu_wordpress_sidebar_nested-list_select-editor.png","contentUrl":"https:\/\/www.inmotionhosting.com\/support\/wp-content\/uploads\/2013\/01\/edu_wordpress_sidebar_nested-list_select-editor.png","width":170,"height":333,"caption":"select editor menu option"},{"@type":"BreadcrumbList","@id":"https:\/\/www.inmotionhosting.com\/support\/edu\/wordpress\/sidebar-image-links\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.inmotionhosting.com\/support\/"},{"@type":"ListItem","position":2,"name":"How to add images and image links to your WordPress sidebar"}]},{"@type":"WebSite","@id":"https:\/\/www.inmotionhosting.com\/support\/#website","url":"https:\/\/www.inmotionhosting.com\/support\/","name":"InMotion Hosting Support Center","description":"Web Hosting Support & Tutorials","publisher":{"@id":"https:\/\/www.inmotionhosting.com\/support\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.inmotionhosting.com\/support\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.inmotionhosting.com\/support\/#organization","name":"InMotion Hosting","url":"https:\/\/www.inmotionhosting.com\/support\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.inmotionhosting.com\/support\/#\/schema\/logo\/image\/","url":"https:\/\/www.inmotionhosting.com\/support\/wp-content\/uploads\/2023\/02\/inmotion-hosting-logo-yoast.jpg","contentUrl":"https:\/\/www.inmotionhosting.com\/support\/wp-content\/uploads\/2023\/02\/inmotion-hosting-logo-yoast.jpg","width":696,"height":696,"caption":"InMotion Hosting"},"image":{"@id":"https:\/\/www.inmotionhosting.com\/support\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/inmotionhosting\/","https:\/\/x.com\/InMotionHosting"]},{"@type":"Person","@id":"https:\/\/www.inmotionhosting.com\/support\/#\/schema\/person\/d850efb28ef3573db7d24b0d8fa9eaed","name":"Scott Mitchell","url":"https:\/\/www.inmotionhosting.com\/support\/author\/scott\/"}]}},"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"primary_category":null,"_links":{"self":[{"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/posts\/2208","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/users\/8"}],"replies":[{"embeddable":true,"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/comments?post=2208"}],"version-history":[{"count":4,"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/posts\/2208\/revisions"}],"predecessor-version":[{"id":85023,"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/posts\/2208\/revisions\/85023"}],"wp:attachment":[{"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/media?parent=2208"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/categories?post=2208"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.inmotionhosting.com\/support\/wp-json\/wp\/v2\/tags?post=2208"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}