How to display SQL/Database content in pages built with Elementor | WordPress Tutorial

say that we are building a page for the WordPress website with elemental you are the section with two columns you put a new mod in the right column and you want to display some information in the left arm but that information is stored in your website's database for example you want to display this SPL table in the form of an HTML table so how can we do that it's actually quite simple first of all we are going to insert a shortcode element to the left column if you don't already know what your codes are you should really look it up as it is a very useful functionality for WordPress programmers long story short short codes are tags for code snippets you can include those tags to your page while you are creating it every time your page is then requested by a client they associated code snippets will execute okay so now that we have created a shortcode container for our page we need to create the actual shortcode and its associated PHP snippet to do that we will need a plug-in called insert PHP code snippet I have already installed it as you can see here but we are going to hover over plugins select add new type the name in the search bar locate the plugin and prints in stolen then activate once installed you can see it on the left sidebar of WordPress dashboard cover over it and select PHP code snippets there are some already created by me short codes here while you are going to see a Mentalist now click on the add new PHP code snippet button it's time to create our shortcode give it a descriptive trading name I will say SQL example now this is the field where you submit your actual PHP code in our case this is the PHP script that does a job for us its first job is to go to the database and fetch the rules of the table we want to do that equals an already active database connection that the reason Boris we can access this connection through the WPT be variable this is a query it submits the database server once the script gets the results back that is when the execution of this function over here or method terminates he thought would say needs tml table to display the retrieved 8 this is some basic CSS code to start the table this is the actual HTML code from the table this is a cord loop of our script what does is to iterate over the SQL rows that it code from the database and uses those rows to fill our HTML table so now we'll just copy the code for my text editor and paste it into the PHP code field of the third code editor I'm hitting create and hopefully I can see a green message telling me that the suit code was created successfully and I can see it on the list too now that we have created our church code who then plug it in our cuff in spades for start copy the shortcode like this now go back at editing a page with Lam enter here is the left column we created before let's click it and we'll consider is an input field asking us to insert the shortcode click it and paste our short code the moment you do that the associated PHP code will execute and produce some HTML code this HTML will be applied to the left column of our section here and we can see a very nice table containing the rows of our SQL table now in order to test our code let's add a new row to our respir table now that we audit our oh let's see what reflects to our pains as it should let's hit refresh and we can see the new row displayed so our code works that was it I hope this video will be helpful including database content in pages built with alum and ER thanks for watching

Channel: Programming Tutorials

Views: 33,910

Rating: 4.9166665 out of 5

Keywords: wordpress, web development, elementor, sql, php scirpt

Id: 1LwWa0li09c

Length: 5min 30sec (330 seconds)

Published: Tue Jan 14 2020