Table ShortCode General

We want a shortcode / snippet for the tiny tables.
Tiny Tables are tables with exactly two columns and unlimited rows. They consist of a text column and an image column.
We currently use

• a width of 300 for the text column on the left and
• a width 700 for the image column on the right,
• hence of a total of 1000.

Tiny tables are adapted to relative design on mobile or smaller displays.

Shortcode

Trello link

The syntax is

• T for start of table
• R for the start of a row
• I the start of the image column
• /R end of the row
• /T end of the table

Comment

I do not like the snippets because they are not See What You Get.
They are OK, for posts that have occasional “beauty images”.

Whenever we have many images and graphs, we should use a big tiny table.

Implementation

plugin Name – TinyTable

Shortcode

. - Click to enlarge

Problems

Table does not go to right end of page

Table Width

The table does not go to the right of the page.

see here
See image:

Graph must be 700 width, set manually

Better Solution:

Set snippet text width to 300 and Rad must set graph always to 680

Problem: Table width

- Click to enlarge

Problem with DIV

ShortCode Breaks Sidebar

Tiny Table Shortcode breaks post so that side bar is not displayed

This post does not show the side bar:

• Post without side bar

Problem: ShortCode Breaks Sidebar

- Click to enlarge

Shortcuts inside a div expression

<div class=”field field-type-filefield field-field-image-teaser”>

[ /R ]

[ /T ]

</div>

Solution: Correct The Div

. - Click to enlarge