0

I am using woody snippets to insert php code to make an API call to return information in a table. How do I get the table to display using the default css from my wordpress theme?

I am new to PHP, but not to wordpress. And I know just enough CSS to get myself in trouble. So, I need ELI5 instructions.

My programmer provided the basic PHP code to call the API and return the data in a basic table. But, it looks horrid and there's no spacing or styling. 


    $tableStart = "<table>";
    $tableEnd = "</table>";
    $trStart = "<tr>";
    $trEnd = "</tr>";
    $tdStart = "<td >";
    $tdEnd = "</td>";

    $fname = 'alabama_energy_data.json';

    $data = json_decode(file_get_contents($fname));

    echo $tableStart;

    foreach($data as $bill_data) 
    {
      echo $trStart;

      echo $tdStart . $bill_data->bill_id . $tdEnd . $tdStart . $bill_data->title . $tdEnd;


      echo $trEnd;
    }
    echo $tableEnd;

This returns a basic table with the data I need, but it's not styled. How do I get it to use the default CSS from our wordpress site that it's displaying in so that the table renders in a format that looks decent?

Bingosgirl
  • 11
  • 2
    It's impossible to answer this question effectively without an understanding of the CSS classes that are provided as part of your currently-enabled Wordpress theme. – esqew Jul 31 '19 at 20:54
  • What esqew said. Your theme (or maybe a plugin?) may even apply some CSS classes to HTML tables (eg. ``). If so, if you don't add those to your table then it'll use the default styling as provided by the browser.
     – cabrerahector Jul 31 '19 at 21:02

1 Answers1

0

If your table isn't styled like it should be, then you're probably missing and id or class attribute at your table. You could check on what current attributes your "wordpress" tables have, and just add them to your table.

Example:

<table class="wp-class-table">
# OR
<table id="wp-id-table">

And one other thing, I personally don't really like the way you "echo" your data. If you want, you can read this answer. It shows a nicer way to do it in my opinion.

YTZ
  • 876
  • 11
  • 26