Add image buttons to front page and remain responsive

Homepage Community Forums Epik Theme Support Add image buttons to front page and remain responsive

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #13117
    Jaap
    Customer

      Hi,

      I am working on a new site and I need to have 6 (maybe more in the future) buttons in the slider area. I need them here because that is where I can have a custom background image. However, the way that I have done it now is through an html table format in a text widget. This does not work for a responsive site and I was wondering if there is a way to do this better?

      Thanks in advance!

      #13126
      Eric
      Customer

        Do you have a link so we can see what’s going on?


        I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com

        #13136
        Jaap
        Customer

          Oh shoot… I did put it in the other posts i did….
          http://www.tandartspraktijkparklaan.nl/

          Thanks!

          #13149
          Eric
          Customer

            It seems to be responsive to me. Although, I would recommend not using tables, especially for something as simple as what you’re doing. I’d just use divs. Tables aren’t recommended because they are not consistent across all browsers. So try and recode it with divs and it should still be responsive.

            Perfect example – http://demo.appfinite.net/epik/columns/ Use the 3 column code for your images and it will be even more responsive. It will align in a single row when viewed on mobile devices. here is the code –

            <div class="one-third first">
            <p>This is an example of a WordPress post, you could edit this to put information about yourself or your site so readers know where you are coming from. You can create as many posts as you like in order to share with your readers what is on your mind.</p>
            </div>
            
            <div class="one-third">
            <p>This is an example of a WordPress post, you could edit this to put information about yourself or your site so readers know where you are coming from. You can create as many posts as you like in order to share with your readers what is on your mind.</p>
            </div>
            
            <div class="one-third">
            <p>This is an example of a WordPress post, you could edit this to put information about yourself or your site so readers know where you are coming from. You can create as many posts as you like in order to share with your readers what is on your mind.</p>
            </div>

            I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com

            #13153
            Jaap
            Customer

              Hi Eric,

              I had been looking at using divs but I have very little experience with those. I do some CSS coding but it si always kind of trail & error with me. I keep trying stuff until I have got it to work. However, in this case I would not know where to begin. Could you please tell me in which file I would need to place the code for just showing the 3 column images on the homepage?

              Thanks a lot in advance. These are the last little bits before focus is on SEO the text.

              Cheers,
              Jaap

              #13157
              Eric
              Customer

                You can use a text widget to add custom HTML code inside of a widget area. So you can copy that code above and add it in the text widget to see how it will look, and then replace the text with your own images and text.

                To learn more about div containers, check out this site – http://www.w3schools.com/tags/tag_div.asp and there are many others that can assist as well. It’s pretty easy once you get the hang of it.


                I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com

                #13175
                Jaap
                Customer

                  Hi Eric,

                  Ha… that’s odd. That was exactly what I did after your first response. But then it showed all coded on the homepage. Hence I deleted it again. But I redid it now again and it worked like a charm! Awesome and full responsive.

                  Thanks a lot.

                  #13176
                  Jaap
                  Customer

                    Wow, thank you very much for bringing this to my attention, Eric. As said, I had tried to play with it before but it did not do what I wanted. Now that I have figured out what to do with the <div>’s it is SO easy. The site is now 100% responsive on all platforms that I could test 🙂

                    Many thanks and very appreciated.

                    #13202
                    Eric
                    Customer

                      Awesome! Glad I could help!


                      I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com

                    Viewing 9 posts - 1 through 9 (of 9 total)
                    • The topic ‘Add image buttons to front page and remain responsive’ is closed to new replies.