Inserting, editing, and working with tables inside of Joomla articles can have it's challenges. This tutorial demonstrates a great solution for doing so. SUBSCRIBE TODAY! ► https://goo.gl/N6y5bH
ENTER TO WIN! ► https://www.basicjoomla.com/contests
FOLLOW US ON TWITTER! ► @basicjoomla
LIKE US ON FACEBOOK! ► https://www.facebook.com/basicjoomla
The editor being used in this tutorial is JCE Editor with a full complement of the subscription based add-on buttons.
This tutorial will show you how to use the table features for working with tables inside of an article in Joomla.
To demonstrate how tables works we're going to log into the back-end of the site and open up and edit an article.
This editor is JCE editor. It's a "by subscription" editor for using in Joomla. Let's put a table in there now, and just click in the article, make a new line for it.
We need to add a row. Well that's easy. We can do that a couple ways. First of all, we'll click somewhere in this row, and now you see all these table buttons are alive and there's a button when you mouse over that says, "insert row after." Yes, that's what we want. Here's one that would put a row in front, but now we'll put the kid last. So, we click on there. There we go!
And that's basically a lot of the basics of how to work with tables using JCE editor in Joomla.
Now just as we inserted a column, sorry, inserted a row, we can insert a column by clicking anywhere in any cell in this column and using this button "insert column before," "insert column after" or we could delete that column all together. Now it does get a little bit goofy when we start merging certain cells over rows and deleting but that's the same in any software, just tables are fiddly that way. But why don't we put a column in before this column. Now it's there but there's nothing in it so it's skinny like our initial one. But if we click in there we could go "Initial." And John's initial is G, and Jane's initial is H, and Joey's initial is K.
Now you notice that this table is also shifted off to the left of the article here, and if we want it to appear centered in the article, one might think you could click outside the box here and just click "center" ... let's give that a try ... nope that did not work. I didn't think that was going to work. What you do is this. Click the table somewhere, right click, go to table properties. Table properties will come up and here's where you set the alignment. I'm going to pick Center and click update. Now that table will always be centered on the page. This can be fiddly in other versions of JCE editor and other versions of Joomla and it's possible could be fiddly on your site even if you're using the same things that I'm using. But they're constantly updating the code and fixings things like that.
You'll see some other things that you can do here. We could select this whole row and we could go to a background color, and we could give it a slight blue shade. Now oh that's the background for the text. Well we don't want just that highlighted. Well maybe you do; I don't. I'm just going to click "undo." Let me just pause to look at these buttons a little bit better.
And having paused I see what we want to do. If I click in the row, right click, and go down to "row," now I can select "table row properties" and I have some general properties here. I could center everything in that row, the alignment I could Center it. I can make the text in it aligned to the top. Lots of things to experiment with in here.
But with regards to shading, we can go to the Advanced tab, go to the background color, and here we can pick something along the dial here and use the color picker. And look, we can do a border color. There we go. And it's black all the way around. Now we could go to row, table row properties, and we've picked the color. Let's pick a different color, let's pick that nice red there. And update. Now we've got individual red borders around there but we have a black border on the table.
When we right click in here and go to table properties there is a place where we can set the width. So I could make a huge table that's 900 pixels wide. We go update and now it's stretched out big and that's great for the website. But if your site is ... if it's important for your site to be able to be viewed on mobile devices - especially cell phones - setting a width for your table or even using tables can really throw off your mobile template. They're not, tables are not always mobile friendly and most often aren't, so use those sparingly.
So I'll just wrap things up right there, and enjoy working with tables on your Joomla site. God bless!
Tutorial Theme Song "Bluewater" courtesy of http://www.freestockmusic.com
Looping Background "Teal Tiles" courtesy of http://www.motionbackgroundsforfree.com #joomla