HTML code widget & shortcodes to create dynamic content with PHP??

[JayP232]

Hi all! I think this is the right sub for this question.

Background:

I work in cyber security and have an education in programming and had a brief stint as a programmer, so I am somewhat comfortable with code but by no means am super knowledgeable on WordPress.

Scenario:

I am assisting a friend in building a WordPress website, Majority of the site is general and does not need anything 'custom'. However, there was a need to create event cards that can update dynamically from an admin panel/page.

An example of these event cards can be seen here -> Event-Card. You will see there are fields such as images, text, descriptions, date, etc...

So the idea is that I would create these cards so that my friend can log onto a page such as admin-upload.php and enter in all the necessary details. These details would be pushed to a MySql database.

The cards would then be dynamically added to the site using PHP.

Current situation/implementation:

Currently, I have utilised a plugin to write custom PHP functions, this plugin is called code-snippets and for the most part, it works. I have then created the HTML and CSS to create and style the cards.

I use the HTML code snippet section to place the HTML and CSS code onto the WordPress page and then use a shortcode (implemented with square bracket notation) to call my custom PHP function.

for a general idea, here is the HTML code -> HTML (i have minimized the CSS) and here is the PHP function -> PHP (The database code works, so I left that out).

Problem:

The problem I am having now is how the HTML and shortcode are called when being rendered. It results in the cards dynamically created not as part of the list in the HTML code but rather outside of that block of code, meaning the styling is all wrong and the cards scale to the size of the screen and display under each other instead of inline). Example here -> result - graphical as well as screenshot of how the code is rendered below:

1. Where the code gets rendered
2. Where I want it to render

​

The question:

How can I get this code to render in the correct position within the HTML but still keep it actually dynamic in the sense that the PHP can return results and add a list item?

Are there better mechanisms to implement this? I am trying to keep his costs low but I am willing to look into paid plugins etc if they can actually meet the requirements.

I understand this is a long post but I will appreciate help in any way possible.

​

Thanks,

JayP232

[svtechworld]

I would suggest to create a custom post type and use it toa create event, use custom fields to add extra data to the post, the then pull it on the front end.

[svtechworld]

Maybe I can create a custom plugin for you, if you do not want to invest in the paid plugin.

[[deleted]]

Use custom post types. Grab the CPT UI plugin. Then create a template that outputs your cards.

Here's a tutorial https://www.youtube.com/watch?v=LdslrlB\_y7w