Create a WordPress table in HTML is very easy. You can use an plugin for this too, of course…but the plugin has to be installed forever and It affectes to your hosting too.
The first step is open a “new post” or a “new page”, and click “text” button, It sometimes is called “html” too, but in anycase you must to leave “visual”.
The second step is to write this code:
<table> </table>
This code will create a table. Now, It is necessary to define the column and files number.
For this I will use the next tags: <tr><tr> y <td></td>, the <tr> tags are introduced into <table></table> tags, and the<td></td> tags into <tr></tr> tags….each<tr></tr> is a file and each <td></td> is a column. Maybe It could look complicated at beggining but It is very simple. Let’s go:
<table> <tr> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> </tr> </table>
End of example.
If you change to “visual” mode now, It would see like this:
Now you can write something in each square in the visual mode or you can write something at “text”/”html” mode in each tag….but It is more simple in visual mode. Ok. Let’s go to write in there:
Hosting | price | GB | Processor |
Hosting A | 20€/month | 5 | Dedicated |
Hosting B | 15€/month | 6 | Shared |
In this way you can create a table using HTML into WordPress, Tumblr, Blogger, Wix or other sites.
The last table is a bit simple, I know It, but It is not a problem, you can change It more:
<table style="background-color:blue;color:white;border:solid black 3px;"> <tr> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> </tr> <tr> <td></td> <td></td> <td></td> <td></td> </tr> </table>
It would look like this:
Hosting | Price | GB | Processor |
Hosting A | 20€/month | 5 | Dedicated |
Hosting B | 15€/month | 6 | Shared |
It is so simple, the code added: style=”background-color:blue;color:white;border:solid black 3px;”
Just copy that code and change the color you want to use. You can change 3px for 1px or 5px, It will change the border thickness.
If you want to use a specific color you can use the nest web: Color Picker.
Pick the color you want to use, in the side will appear a code like this: #4d4dff
You must to replace the color names with the code.
And It is all, of course, you can create more personalized tables using more HTML and CSS but It will be explain in another post!
|
Acepto donaciones de BAT's mediante el navegador Brave 🙂 |