Widgets Side by Side

You can make a table using HTML (or even Excel), and then put the shortcodes in the cells.

That’s how I did it.

Try this code for a 1 row, 3 column table
All cells are left and top aligned. The cells are almost equal in width.

Paste it into your WP post when in “Text” view, and then switch back to “Visual” to carry on with the rest of your article or page.

<table width="100%" border="0" cellpadding="1">
<tbody>
<tr>
<td align="left" valign="top" width="33%">[widgets_on_pages id="1"]</td>
<td align="left" valign="top" width="33%">[widgets_on_pages id="2"]</td>
<td align="left" valign="top" width="34%">[widgets_on_pages id="3"]</td>
</tr>
</tbody>
</table>

Thank you very much, now one last question that i guess you know, how do i add link to the widgets so when someone click it they direct you to the place i link.

Thanks again, work perfect!

Sorry Ocher – not entirely sure what you mean?

If I have understood correctly, then you can drag a “Text” widget into the correct widget area in Appearance > Widgets and add the code in there.

If I have misunderstood… please explain in a bit more detail.

Remember that you need to have upped the number of “Widgets on Pages” in the settings. I don’t bother renaming mine (which is why in the code it says such things as widgets_on_pages id=”1″)

You can see mine on https://www.spainbuddy.com

I need to work out how to make the height of each cell fixed, as I don’t like the way it displays on my site. I tried adding height=”300″ but it didn’t work. I should start a new thread perhaps.

Elle xx

Hey Ocher, you shouldn’t really be using tables for layout… presentation/layout should be achieved with CSS (tables are for tabular data).

Also, have you got a link please so I can give you some precise CSS?

Reparde what i means is how you link the imagine? when i went to your page, i click to one of the pictures you have and link me to another page, thats what im trying to do & Toddhalfpenny here the link

https://www.rawrlifeco.com

Thanks Ocher.

So I see you’re using the Widgets on Pages template tags… in your case I think you’d perhaps be better of just having one Widgets on Pages sidebar and no table. The each widget could be laid out using CSS as explained here. To get the images linking you need to just use basic html linking. See the w3chools site for starters.

I hope all this helps.

Thanks and nice tutorial, but where do i copy paste those CSS?

The CSS could be placed at the end of your theme’s style.css

thanks, all the code or just someone? & im sorry im not a web developer im just another person trying to be success on life. thanks again

Only include the CSS that is relevant for you. I am not saying that the blog post code can be copied exactly but it gives you an idea on what/how some things can be achieved.

I suggest having a play around and doing some reading/learning… that way success my come.

Thanks Todd, but its doesn’t work!

Hey Ocher,

I think this will work but you need the correct code for your site.
As I said… have a play and read up.

Feel free to post a new link if you’re still having issues.

Ta,
Todd

hi there, i can’t figure out how to align the widgets horizontally.

i’m using the widgets on pages plugin and there is no option for alignment.

I would like to actually create more sidebars, place them next to each other horizontally, then add just one text widget to each..

thank you, anything helps