Your cart is currently empty!
Homepage › Community Forums › Epik Theme Support › Add image buttons to front page and remain responsive
Tagged: multiple images, Slider
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!
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
Oh shoot… I did put it in the other posts i did….
http://www.tandartspraktijkparklaan.nl/
Thanks!
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
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
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
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.
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.
Awesome! Glad I could help!
I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com