Free styling demo

Z

Demonstrated features

  • responsive table
  • modal popup
  • free styling

Required skills

  • novice

Required license

  • free
This demo shows a responsive data table styled using the Code Manager.
Current active styles
  • WP-Data-Access-Data-Publisher-Color-Black
  • WP-Data-Access-Data-Publisher-Display-Wide
  • WP-Data-Access-Data-Publisher-Rounded-Corners-Small
Actions
Publication Layout Panel
FirstnameLastnameEmailPhone NoAddressZipcodeCityCountyCountry
FirstnameLastnameEmailPhone NoAddressZipcodeCityCountyCountry

8 Comments

  1. Sebastian Holmeier

    Hi,

    WP Data Access has been very helpful for me so far, thanks a lot for the effort!

    Just two things I haven’t figured out yet: Is there a way to modify the publication style, so that (a) the general search field will be wider, e.g. the entire width of the result table, not just the upper right corner, and (b) that the column search fields appear on top of the table and not below? I believe I read the whole documentation, but didn’t find any options for that. Or would there be other means?

    Unfortunately, I am quite inexperienced (but more than willing to learn).

    Many thanks,
    Sebastian

  2. Peter Schulz

    Hi Sebastian,

    Welcome! You can style almost anything in your publication! 🙂

    Here is a page that might be helpful:
    https://wpdataaccess.com/docs/data-tables-styling/global-styling/
    https://wpdataaccess.com/docs/data-tables-styling/premium-styling/
    https://wpdataaccess.com/docs/data-tables-styling/code-manager-styling/
    https://wpdataaccess.com/docs/data-tables-styling/styling-issues/

    In a nutshell:
    – Use global styling to give all your publication the same layout
    – Use premium styling to style specific publications (easiest way)
    – Use the Code Manager to style specific publications (more work)
    – Use manual styling to style specific or all publications (most work)

    Hope this helps,
    Peter

  3. Sebastian Holmeier

    Thank you Peter for your prompt reply.

    I guess, for my specific requirements (larger search field, column search fields on top of the table instead of below) I will have to go for CSS, as I haven’t found anything in the „easier“ solutions. Right? Will do so…

    Thanks again for all your effort,
    Sebastian

  4. Peter Schulz

    I think your right! 🙂

    Let me know if you need help,
    Peter

  5. jhione

    The link to the video just refreshes to this page.

  6. Peter Schulz

    Thanks for mentioning! I updated the link…

  7. Ray Pierce

    How can I remove the column headings at the bottom of the table?

  8. Aaron Lee

    Hi Ray,

    You can remove the column headings at the bottom with CSS.

    Here’s the snippet:

    table.wpda-datatable tfoot {
    display: none;
    }

    You can also target a specific table by using its table ID:

    #yourTableID tfoot {
    display: none;
    }

    I hope this helps!