• Resolved mbjepsen

    (@mbjepsen)


    I am administrating a number of databases. I am not a programmer at all so I have depended om PHPRunner for many years.

    I want to change platform to wordpress, but PHPRunner is not easy to implement. Consequently I am exploring other options and this is where WP Data Access is interesting.

    I have set it up and it appears to be running, but I have bumped into a problem. The table I am publishing is to wide for my Theme.

    Peter Schulz actually gives an example on this in his roadmap video: https://wpdataaccess.com/docs/documentation/data-publisher/roadmap/

    However, it will not work for me. Peters example is a table called demo_product and the table is in the default WP database. He adds the following additional CSS:

    #demo_product.dataTable.nowrap td {
    white-space: normal;
    max-width: 300px;
    }

    This solves the problem for him.

    My table is called tyske_koder and is found in an remote database (RDA, not the default WP database). I tried with this:

    #tyske_koder.dataTable.nowrap td {
    white-space: normal;
    max-width: 300px;
    }

    This have no effect on my table. Is the syntax different for tables in a RDA? Can anybody help?

    • This topic was modified 3 years, 8 months ago by mbjepsen. Reason: Spelling mistake

    The page I need help with: [log in to see the link]

Viewing 15 replies - 1 through 15 (of 16 total)
  • Use this…

    .container {
    max-width: 100% !important;
    /* max-width: fit-content;*/
    }
    – Jack

    Thread Starter mbjepsen

    (@mbjepsen)

    Thanks for reply Jack

    In inserted this into the additional CSS:

    .container {
    max-width: 100% !important;
    /* max-width: fit-content;*/
    }

    Unfortunately it had no effect on anything.

    Can it have something to do with the theme I am using? I am using “Twenty Ten”

    Yeah, probably theme related – I had to change themes at first, it kept overwriting my code. Look for a full screen theme and then delete all the side bar stuff in the theme customization. I’ll take a peek at the sample page and see what’s up.

    – Jack

    Follow-up, I took a look at your page.

    You would have to create a child theme and edit that page with quite of bit of code to correct the current theme you are using – no shortcuts that I saw. I was in the same boat, it just wasn’t worth all the time with my project to go creating child themes and custom code…

    Simplest method is to change to a full width theme and remove all the side bar stuff, then use the css code I showed you in the css editor – I use the Simple CSS plug-in so it saves the code during update. I think I used the “Honey Press” theme as I recall.

    – Jack

    Thread Starter mbjepsen

    (@mbjepsen)

    Thanks for the advice, but as I said earlier, I am not a programmer, I am a editor. I come from a PHPRunner environment where you specify what you want by ticking boxes in the setup. No programming.

    If it is so complicated to get WP Data access to show my simplest table within my screen widths, it may not be se solution to my problems. It is a shame because I would really like to switch to wordpress and WP Data Access looked like a solution to by problem.

    Plugin Author Passionate Programmer Peter

    (@peterschulznl)

    Hi @mbjepsen,

    Text columns are not wrapped be default. Please add this to your page to wrap column Dorklaring:

    .dataTable.nowrap td.Dorklaring {
        max-width: 300px !important;
        white-space: normal;
    }

    Sorry for my late reply, I’m on holiday in Denmark! 🙂

    @jcmplastics Thank you your help Jack! 😉

    Best regards,
    Peter

    Thread Starter mbjepsen

    (@mbjepsen)

    Peter
    Thanks for this advice. It solved the problem. There is hope after all.

    But I have a question:

    I inserted the css code in the additional css. This means that it affects all the tables generated in WP Data access.

    My project involves over 40 databases that I want to make accessible on this WP site. Some of these databases have more than 50.000 records and many of the databases have the same column names. The way I understand it, the CSS I gave now inserted will do the same to any column called “Dorklaring” regardless of which database it originates from. But I do not necessarily want to format all these different databases the same way.

    Is there a way of making the formatting you suggested applicable for only a specific database presented on a specific WP page?

    Funny that you are on vacation in Denmark. I am a Danish national resident in Norway for the last 30 years. I quess that you are somewhere on the west cost of Jutland. Hope you enjoy.

    Best regards
    Morten

    Plugin Author Passionate Programmer Peter

    (@peterschulznl)

    Hi Morton,

    Good point! 🙂

    This css does indeed change your column settings for all Dorklaring columns. If you want to be more specific, you can add the table id in front of your css. The name of the table on the page you asked help for is tyske_stempler1 (you can use the inspector to find it). Just change the css as shown below to prevent other columns with the same name being formatted the same way:

    #tyske_stempler1.dataTable.nowrap td.Dorklaring {
      white-space: normal;
    }

    Sorry, you can remove this:
    max-width: 300px !important;
    That was not necessary. Just need to redefine property white-space.

    Best regards,
    Peter

    Thread Starter mbjepsen

    (@mbjepsen)

    Peter

    This worked also. I think my initial problems are solved. I think you can close this one.

    And once again, thanks for the help. I am sure that I will be back with more questions.

    Best regards
    Morten

    Thread Starter mbjepsen

    (@mbjepsen)

    Peter, I am back with my next problem which is also related to formatting.

    The discussion above is related to a very simple database with only 3 columns and nothing collapsed.

    No I have gone on to something more advanced:

    The page is here:

    https://test.arma-dania.dk/?page_id=484

    A good example is on page 4. Stempel: 1B. 214, Line number 32110

    When you expand this record, it appears that my CSS is not affecting anything of what was collapsed. I have tried to affect the vertical alignment with

    table.dataTable.nowrap th, table.dataTable.nowrap td {
        vertical-align: top;
    } 

    But is is not affecting the collapsed part of the record.

    Also, the column stempel_paa is not wrapped. I tried both

    #View_avd_stempel7.dataTable.nowrap td.stempel_paa {
      white-space: normal;
    }

    and

    .dataTable.nowrap td.stempel_paa {
    	max-width: 300px !important;
      white-space: normal;

    But with no result as you see from the table.

    Is there a simple solution to this?

    I hope so because I have 9 databases which contains hundreds of articles with lots of text and photos. The database here is still quite simple compared with the rest of the stuff.

    Here is an example of a typical record:
    http://www.arma-dania.dk/public/timeline/_AD_blankvaben_view.php?editid1=26

    • This reply was modified 3 years, 8 months ago by mbjepsen.
    Plugin Author Passionate Programmer Peter

    (@peterschulznl)

    Hi @mbjepsen,

    I have visited this page:
    https://test.arma-dania.dk/?page_id=484

    But the page only shows a search box. Was the page replaced? Can you send me the correct URL?

    Thanks,
    Peter

    Thread Starter mbjepsen

    (@mbjepsen)

    The link works fine here, but I had not published the page. Maybe one need to be admin before it is posted.

    Now I have posted it and the new link is:

    https://test.arma-dania.dk/danske-afdelingsstempler/

    Plugin Author Passionate Programmer Peter

    (@peterschulznl)

    Thanks! 🙂

    Please add this to your css:

    .dtr-title {
        vertical-align: top;
    }

    Does it work?

    Best regards,
    Peter

    Thread Starter mbjepsen

    (@mbjepsen)

    Peter, that solved the vertical alignment issue. But i am still missing the wrapping of the fields. Some of the texts are very long

    If you search for this record: 1B. 214 (don’t forget the space in the middle). This is a good example.

    Plugin Author Passionate Programmer Peter

    (@peterschulznl)

    Hi @mbjepsen,

    You can wrap these columns as well with this css:

    .dtr-data {
        white-space: normal;
    }

    Best regards,
    Peter

Viewing 15 replies - 1 through 15 (of 16 total)
  • The topic ‘Help needed with CSS’ is closed to new replies.