Link is an adaptation of the “Link” theme by Blacktie.co for WordPress. It is a modern, fully responsive, “flat” style theme with a nice color palette, big full-width images, and full-width colored sections. The navigation is a toggle menu fixed to the top of the page. When clicked, the menu flies in from the right. It also lets you add your social media links.

The Link theme is a child theme for Flat Bootstrap.

It automatically adapts for desktops, tablets, and phones. It is based on the standard WordPress starter theme (_S) and the Twitter Bootstrap CSS framework. The theme was inspired by the HTML/CSS themes from Blacktie.co and color schemes from Designmodo.com’s flat UI.

Features include a fixed toggle menu, multiple columns (grid), buttons, icons, labels, badges, tabbed content areas, collapsible content areas, progress bars, alert boxes, carousels (sliders) and much, much more.

This theme is designed to have a “static” home page and so when previewing the theme and when you first install it, a sample page is displayed. The theme is perfect for showcasing products or photos with a midnight blue page header.

Theme Features

  • Fully responsive theme that changes layouts for desktop, tablets, and phones
  • Navbar fixed to the top of the page for easy navigation
  • Modern, “flat” style theme with beautiful color palette
  • Big full-width featured images on any page
  • Full-width colored sections
  • Hundreds of icons from Bootstrap and Font Awesome
  • Variable column footer with 1 to 4 columns

WordPress Features Supported

custom-background, custom-header, custom-menu, featured-image-header, featured-images, flexible-header, fluid-layout, full-width-template, left sidebar, light, one-column, responsive-layout, right sidebar, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready

Page Templates

  • Full-width page with colored page header
  • Full-width page without page header
  • Full-width page with three (3) most recent posts (in columns on desktop)
  • Page with right sidebar (default)
  • Page with left sidebar
  • Page without sidebar
  • Site Index with search, pages, categories, tags, and recent posts listings

We’ve even included the ability to have individual posts be full-width as well.

“Shortcodes”

Our “shortcodes” aren’t really shortcodes… you simply use the standard Bootstrap markup, such as < div class=”whatever”>. If you really like shortcodes instead, you can download either of these plugins. They both work just fine with this theme.

  • Colored buttons
  • Colored message boxes (alerts)
  • Tabbed content areas
  • Collapsible content areas
  • Sliders (carousels)
  • Everything else that the Bootstrap CSS framework has to offer!

Sample Usage

Link Theme Sample

Demo and Download This Theme

Demo this theme Demo

Download this theme from the WordPress.org Theme Directory Download

More Information

78 responses to “Link Bootstrap WordPress Theme”

  1. praesenz2 Avatar
    praesenz2

    Hello Tim,
    I like the LINK theme very much! Thank you for making such a fine work!
    There are a few things to report/ask:
    1. On one of my websites [ http://rueckfuehrungstherapie-frankfurt-web.de/ ] the sidebar does not disappear in the smartphone display mode, so that the header is not centered. Can you help with that, please? (I use this theme on two other sites and this does not happen there.)
    2. Is it normal that when the page builds up, before the appearing of the header image, a green header background is appearing first!?
    3. It would be nice if one has more options to decide where the widgets (for example in the page bottom) can be placed.
    4. The menu in the sidebar is bottom up in terms of the page order.
    5. When you use pictures in the widgets, it would be fine if you could choose from the already uploaded media. Otherwise you always have to exit the theme adaptation, go into media, copy the link, go back in the theme and paste……
    Sorry to bombard you with all this. I can live and sleep very well with all this, I would not want to change the theme! 🙂
    But it would be fine if you could solve the first issue for me, for the sake of responsiveness. Thanks in advance for any hint!
    All the best to you
    Ulf

    1. praesenz2 Avatar
      praesenz2

      Dear Tim, I have more information about the error in 1. of my message above.
      I think am responsible for the error myself. I activated the LINK theme after bootstrap was activated and, as I remember, AFTER choosing my header picture. So then the theme / header was getting confused, I think 😉 .
      And it is not the sidebar which does not disappear, but obviously the header menu. I tried some ideas on my own, but I am a complete lay. So there was not much left than deactivating the menu or the LINK theme and activating it again but that was no solution. I think one has to rehabilitate the right theme code regarding the header / header menu and the thing is running. It is much work for me to set up the complete website newly (even when it is not a big one), so I would be very very grateful for any help to wipe out the mistake. It looks pitiful bad on a non-desktop monitor.
      Sorry to bother you with that. If there was a chance to donate for your efforts I would be glad to do so.
      Best wishes
      Ulf

  2. sammond Avatar
    sammond

    hi,

    nice looking theme. you promote it as responsive, however when I open on a screen smaller than computer, the header image is still wider than the screen. Is there something I need to do to engage responsive styles?

    1. sammond Avatar
      sammond

      UPDATE: so it is the long h1 site title that is breaking the small screen layout. Can an overflow:hidden; be added to that element in the next update?

      1. Tim Nicholson Avatar

        I don’t believe overflow hidden will work. There is CSS that will truncate text to a single line, but in general people will want it to word wrap. If the issue is with a wide feature image added to a page, you can just wrap your text in <small></small> to shrink the font a bit so it fits.

    2. Tim Nicholson Avatar

      All my themes are fully responsive, but what can happen is that if the text being overlaid on the header image or page-specific featured image is a really long word where normal CSS word-wrapping doesn’t work, it may extend beyond the size of a smartphone screen. If you break apart the text overlay into words, it will be responsive. If for some reason you need a really long word to fit on a single line, you can add a line of css code to reduce the font-size. There are posts here that tell you how to do that, but if you need help let me know and I’ll add more info here.

  3. albertorondon07 Avatar
    albertorondon07

    Hello Tim,
    I’m a beginner that just started to use your theme (link), it’s awesome, a lot of potential, at the moment I’m having a hard time trying to customise it so my ideas can fit to it, but I think I’ll eventually get it done.

    Just a couple begginer questions:

    1. In the front page I just want the header image and the three social media buttons that come with the original demo. I’ve taken out all the widgets that come with the demo but there’s a “Leave a Reply” box that I still can’t delete . It get’s between the image and the buttons so I really wish I could get rid of it.

    2. I’ve been reading all of your answers here and I figured out how to put the social media buttons of the original demo on the one I’m working on, but I wanna edit them, I wish I could use other color (on the whole website honestly) and I need to change the icons, cause I want to add Linkedin instead of Google plus.

    If you could tell me how to do this it’ll be awesome. And sorry for my english, I’m from the caribbean and I’m not very very fluent.

    THANK YOU

    1. albertorondon07 Avatar
      albertorondon07

      I wish I could link them to my social profiles too. Thank you so much.

      1. Tim Nicholson Avatar

        Change the <a href=”#”> to link to your social profile, like <a href=”http://twitter.com/timnicholson”>

    2. Tim Nicholson Avatar

      The “leave a reply” is the standard WordPress comment box. Go into your home page and uncheck the box “allow comments”.

      For the social footer, here is the code that you can place in a text widget and then edit it from there. To change the colors, refer to theme’s color palette.

      </div></div>
      <div id="sidebar-pagebottom-content" class="sidebar-pagebottom">
      
      <aside id="sample-text-3" class="widget widget_text section clearfix">
      	<div class="container"><h2 class="widget-title">Stay Connected</h2>
      		<div class="textwidget"><p>Join us on our social networks for all the latest updates, product/service announcements and more.</p>
      		</div><!-- textwidget -->
      	</div><!-- container -->
      </aside>
      
      <aside id="sample-text-4" class="widget widget_text section nopadding fullwidth clearfix">
      	<div id="sf" class="textwidget social-footer">
      		<div class="row">
      			<div class="col-md-4 bg-darkgreen padding-top-bottom">
      				<h4 class="ml">FACEBOOK</h4>
      				<p class="centered aligncenter"><a href="#"><i class="fa fa-facebook icon-lg"></i></a></p>
      				<p class="ml">> Follow Us</p>
      			</div>
      			<div class="col-md-4 bg-lightgreen padding-top-bottom">
      				<h4 class="ml">TWITTER</h4>
      				<p class="centered aligncenter"><a href="#"><i class="fa fa-twitter icon-lg"></i></a></p>
      				<p class="ml">> Follow Us</p>
      			</div>
      			<div class="col-md-4 bg-darkgreen padding-top-bottom">
      				<h4 class="ml">GOOGLE+</h4>
      				<p class="centered aligncenter"><a href="#"><i class="fa fa-google-plus icon-lg"></i></a></p>
      				<p class="ml">> Add Us to Your Circle</p>
      			</div>
      		</div><!-- row -->
      	</div><!-- social-footer -->
      </aside>
      
      </div><!-- .sidebar-pagebottom -->
      <div><div>
      
      1. Jumair Macabago Avatar

        I’m having a hard time putting a link the social logo.. can you help me?
        Do you have a code that look really the same to the sample one? gray style… I don’t like the style of the social logo code above that you give… And even If I like it I don’t know how to put a link..

        1. Jumair Macabago Avatar

          I want to have the kind of logo on the sample… simple logo.. not like the given code above.. the logo box by a green color.. and a word say Follow.. 🙂 can you give me the code of the sample?

        2. Jumair Macabago Avatar

          I want to have the kind of logo on the sample… a simple logo.. not like the given code above.. the logo box by a green color.. and a word say Follow.. 🙂 can you give me the code of the sample, I like your theme so much.. And I want to use it even though I can’t remove the Copyright Theme by… Hehehe.. Thank you for the theme…

          1. Tim Nicholson Avatar

            If you just want one simple logo with the words follow us, then just use this part of the above code:

            				<h4 class="ml">FACEBOOK</h4>
            				<p class="centered aligncenter"><a href="#"><i class="fa fa-facebook icon-lg"></i></a></p>
            				<p class="ml">> Follow Us</p>
            
  4. Ashley Sufflé Robinson Avatar

    Okay, so I’ll preface this comment with the fact that I’m not a designer–just a teacher trying to set up a course website. I love your theme, but is there a way to change the default lightgreen color scheme (for fonts, headers, etc.) across the site? I’ve read through the documentation and haven’t been able to find a place to do so (though I’m GREAT at adding colored boxes now, so there’s that.)

    Any guidance you might have will be greatly appreciated!

    1. Tim Nicholson Avatar

      You can change the link colors by adding CSS like this:

      a { color: #16a085; }
      a:hover, a:focus { color: #19B798; }

      Note that links in the footer, copyright section, or any colored sections you’ve added to a page will still use their original link colors. This is so the links look good and don’t have conflicting color combinations.

      I’ll add this to the online documentation here and have already added it to the readme.txt for the next version of Flat Bootstrap.

  5. Max Jamoski Avatar

    I really like this theme and have been using it for about a month. I did the update through my admin area and now my banner is gone. Can you check out the site and tell me what I need to do to get it back?

    http://www.maxxjams.com

    Thanks

    1. Tim Nicholson Avatar

      I’m guessing that you need to update the parent theme, Flat Bootstrap. The parent theme now handles the large banner images on pages. BTW, I like your site! Hopefully this will fix your issue.

      1. Max Jamoski Avatar

        Yep that was it. Somehow I missed the update link on the Flat Bootstrap theme but it was there when I looked after reading your reply. Thanks for liking the site. Still working on it.

        I was looking into doing a side bar on the right for my facebook and twitter feeds but I only see options for a left side bar. Do I have to change the css to make that happen or is that an addon/plugin/widget?

        Thanks again.

        1. Tim Nicholson Avatar

          The default page template has the sidebar on the right, so you are in luck. The left sidebar template is there in case you want to move it.

  6. Elaine Johnson Avatar

    Hello, Thank you so much for these beautiful themes. I am not a developer, but I really like the Flat Bootstrap Developer theme and want to use it. How can I modify the call to action section at the bottom of the theme? If I need to hire a developer, is there some id/pw they will need to know?

    1. Tim Nicholson Avatar

      There’s some information here on how to do it, but basically whenever you add your own text widget it overrides the sample widget(s). http://xtremelysocial.com/wordpress/userguide/

  7. Дмитрий Корочкин Avatar

    Hello! Thanks for awesome theme! But i have one problem! In “index” page in posts preview i have no html code. http://weloop.ru/ In news no html, but if read full news http://weloop.ru/now-i-eshhe-odna-novinka-ot-weloop/ there it is! (Sorry for my English, hope you understand me)

    1. Tim Nicholson Avatar

      Sorry, I don’t understand. The only thing I noticed that looked like it had bugs was the forum page doesn’t display a title. Can you explain more about what the issues are? Great-looking site, by the way!

  8. Karl Croft Avatar

    Great theme. Like Cody I am trying to place logo in header.php
    Does the img tag need to go in here somewhere/
    //.get_bloginfo( ‘name’ )

    .( function_exists(‘xsbf_spot_replace_oh_with_dot’) ? xsbf_spot_replace_oh_with_dot( get_bloginfo(‘name’) ) : get_bloginfo(‘name’) )
    .’‘;

    1. Tim Nicholson Avatar

      Yep, replace everything you have listed there with .'<img src=”wherever.com/image.jpg”>’. You’ll probably want to hard-code a width and height as well.

  9. Brandon Saw Avatar

    Hi, I’ve been trying to add a “sticky” footer bar to my site, but it seems that for every method I try I can’t get the bar to be “fixed” or “sticky”. Is there a way to do this with this theme?

    1. Tim Nicholson Avatar

      Assuming you want the footer nav and site credits to be sticky (as opposed to the multi-column footer widget area), you can edit footer.php. Where you see div class=”after-footer”, change it to div class=”after-footer navbar-fixed-bottom”. You’ll need to add CSS as well to put bottom padding on the page to make room for the fixed nav. Do that like this: body { padding-bottom: 73px; }

      1. Brandon Saw Avatar

        Thanks for the reply. What would be the easiest way if I want a sticky footer for an email-opt in, rather than the footer nav and credits?

        1. Tim Nicholson Avatar

          Well, for a sticky email opt in, I would look for a plugin to do that.

  10. Peter Bennett Avatar

    Hi, I’ve used link on one of my personal sites, and all is good, great theme. I’ve activated it on another of my personal sites, and no fa bar ‘icon’ (i.e. the stack of plates icon) is showing, just a square, either empty or showing fa, c9 (in a ‘cube’), depending on the browser. The only difference maybe a wordpress version increment, or a flat-bootstrap version (i can get back with those). Any ideas as to the problem? Many thanks for the theme!

    1. Peter Bennett Avatar

      NO ACTION NEEDED. Sorry, it was just an issue with the URL of the site, now resolved, thanks.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

css.php