WordPress.org

1. chill986
   Member
   Posted 7 months ago #
   

   I need the ability to specify the width and alignment of my tables - I can do it fine using style information but here's the problem... if my client wants to work on the page in the visual editor, the style info is stripped from my divs. And having the global settings is difficult - because I have a couple of hundred tables in my website, so it would be almost impossible to manage that way.

   Is there a way to specify width and alignment in the shortcode? That would resolve my needs pretty easily!

   Thanks~

   Cindy

   http://wordpress.org/extend/plugins/wp-table-reloaded/

2. TobiasBg
   Member
   Plugin Author
   Posted 7 months ago #
   

   Hi Cindy,

   thanks for your question.

   I don't really understand

   if my client wants to work on the page in the visual editor, the style info is stripped from my divs

   This can't happen with WP-Table Reloaded, so I assume that you mean HTML code that is directly used in the visual editor, right?

   Do all of your "couple of hundreds" tables need different styling/widths/alignments, or are many of them of the same structure with the same widths? In that case, there would be a way to simplify the CSS code using an extra CSS class.

   But finally, there also is a way to set the column widths in the Shortcode, though I usually recommend the other options. For more on this, please see the plugin documentation at http://tobias.baethge.com/wordpress-plugins/wp-table-reloaded-english/documentation/ namely the section "The Shortcode [table id=N /]" and the parameter column_widths.

   Regards,
   Tobias

3. chill986
   Member
   Posted 7 months ago #
   

   Yes, the column width will help - what about alignment? I would like to align these tables on the right - is there a shortcode parameter for this?

   I only have a handful of tables that don't require special alignment or sizing. And you are correct - all the html I use within WP-Table Reloaded behave as expected.

   Thank you for your rapid response!

4. TobiasBg
   Member
   Plugin Author
   Posted 7 months ago #
   

   Hi,

   setting the alignment is not possible with the Shortcode. The reason is that this requires other code, which can not be set with such a parameter easily.

   Usually, aligning is easier though than setting the column widths (in CSS), as the code can be shortened quite a bit.

   Can you maybe post the links to a few of your tables, so that I can take a look and maybe come up with a good strategy for this?

   Regards,
   Tobias

5. chill986
   Member
   Posted 7 months ago #
   

   Thanks Tobias... I am using <div style="width: 500px; float: right;">
   I stripped width out and added column width but for some reason the tables take up the entire width of the panel, and drops below the slide show. I don't know if it's because of the WP-UI plugin or not. I have a support ticket in to them, but I doubt they are going to be able to help.

   A couple of sample pages (and you can really look at any of the tour pages as I have established the same format)

   http://www.chillconcepts.com/ayresadventures/africa-2/
   http://www.chillconcepts.com/ayresadventures/2012/09/05/rawhyde-off-road-african-adventure/
   http://www.chillconcepts.com/ayresadventures/2012/08/29/namibian-splendors/

   If it would help to have access to the WP site, just let me know. Thanks for your help!

6. TobiasBg
   Member
   Plugin Author
   Posted 7 months ago #
   

   Hi,

   thanks for these details.

   So, in general, you are trying to achieve a two column layout on your pages, and in the right column you want to have tables, correct?

   To achieve this, you are currently using a manual solution using something like <div style="width: 500px; float: right;">, correct?
   This seems to be working fine here, I can't see and dropping below the slide show. What browser is this happening in?

   Now, about the column widths: Are you really wanting to set the widths of individual table columns, in relation to each other? Or are you actually more interesting in changing/reducing the overall widths of a table? That would make more sense to me here.
   If that is the case, my suggestion from above (with the {{{column_widths}}} Shortcode parameter) does not apply, as that has a different use case.
   Instead, you will want to continue with the current "Custom CSS" approach that you are using. The problem with that is, that it is just not working due to syntactical errors in the CSS. What I mean: You have lists of tables like
   

   .wp-table-reloaded-id-1 .wp-table-reloaded-id-2 .wp-table-reloaded-id-3 .wp-table-reloaded-id-4

   in the CSS. However, these tables need to be separated by a comma, i.e.
   

   .wp-table-reloaded-id-1, .wp-table-reloaded-id-2, .wp-table-reloaded-id-3, .wp-table-reloaded-id-4

   Once you change this, the CSS code that sets the width will be applied.

   Regards,
   Tobias

7. chill986
   Member
   Posted 7 months ago #
   

   Got it! Thanks Tobias. Unfortunately the WP-UI plugin I'm using pretty much expands to fill the full width. still trying to sort that out, but for a lot of the tables your help with simply adding a comma between the table classes works great! Can't believe I was confused about that.

8. chill986
   Member
   Posted 7 months ago #
   

   One related question - what is the class-id for the table header? It's behavior appears to be independent from the table.

9. TobiasBg
   Member
   Plugin Author
   Posted 7 months ago #
   

   Hi,

   great that those commas help already :-)

   Can you clarify what you mean with "table header" here and what exactly appears to be independent from the table?
   Are you talking about the first row of the table? You can apply CSS to that by using a CSS selector like
   

   .wp-table-reloaded-id-123 th {
    ...
   }

   Regards,
   Tobias

10. chill986
    Member
    Posted 7 months ago #
    

    LOL yes, I figured it out.

11. TobiasBg
    Member
    Plugin Author
    Posted 7 months ago #
    

    Hi,

    great! That's good to hear!

    Best wishes,
    Tobias

Reply

You must log in to post.