CMS ~ WordPress

As the web project evolves the structure gets complicated. The work is full connections and repeated code. We have to keep it all in head and it is hard to maintain.

The menu is a first example of a part that will be nice to have dynamic. Have same across all the website reflecting the actual changes. The list of work is super tedious – add new and other div structure of an work element, not speaking of the links to work details. A nightmare.

How perfect it’ll be if we can have some form where we can write name of the page or work, upload an image to it, write some text and let the miracle happen. Transform all the information to the desired HTML structure covered to the CSS suit?

Such a “form” in more advanced form is a called CMS (Content management system). The are plenty already. One of them is called WordPress.

add-new-post-computer-law-wordpress

Such a management system allows you to create pages as like write emails. It lets you define your content such as title, description ad to it an image or more, maybe categorise it or define some special characteristics like background color, links, or related posts/works etc.
Once it is saved – doesn’t matter where now – it is there in its raw informational state which will be generated in to a HTML, CSS clothes we have prepared for it, Same way as we do the static website, only this time it generates the divs and such dynamically.

What does dynamically created website mean and how it works?

Say we have a page with list of our works ..many works.
Each work in this list is represented by a image with link to the work detail.

The static way

If we write that in HTML, there is no other way than edit the code each time and add duplicate the work elements/or elements and change the link to the image, and link and who knows what.. again and again and again..
Something like this:

Which means we have to code the content any time we would like to add something new and be hell careful not to break the actual code and do everything right.

The Dynamic way

While, when it is done dynamically the obviously repeated parts can be defined only once and be dynamically created based on the data we have defined in the administration in it natural form, text, image, whatever.

Like this:

note: The code in double brackets are dynamic calls which takes the appropriate parts of the object we progress through and print them out in that place. This is just and example of one of the template syntaxes (TWIG) for programming language (PHP) used exactly for that matter, to generate dynamic content.

If you look at the last code you’ll see same pattern like in the previous HTML example only this time the HTML structure for the work is defined only once, which is enough for any number of works we might have and it will automagically generate each and all work we created on the administration level with the given structure. It’ll generate the div structure for each of them just like that. No code changes necessary.

If we add say 10 works in the administration, the dynamic code will take them all and for all and each will render appropriate div structure. If you add some it’ll create one more, if you delete some it’ll render the structure just for them, not more, not less.

The “for work in works” statement does that for us. Everything which is inside of this statement (closed by the endfor) will by populated by the data currently processed “work”.

Same can by applied to anything. pages, news, works, menu items, images, pdf, .. you name it.
It can by applied to pages, its parts and for parts of that parts and for parts of those parts etc.. Manually it’ll be hell but in dynamically created content it is set only once, “вот и все”.

dyn-to-html

So what the WordPress is?

WordPress is one of the most commonly used content management systems where you can define and upload your content. The CMS in general has the ability to render its content in to so called templates that wraps the content up into HTML beautified by CSS and the like.
Which to normal web users is displayed in form of a website.

What to avoid

Although the templates looks shinny at first glance they are traps. First the look good only because of the well chosen images and the content prepared just for it, to show off. None of which is your real content!
The templates are like rockets. They are done professionals (many times, not always) and you’ll have no slight idea how to change it to your needs.
note: if you gonna try some, look for those based on Bootstrap, that you know already.

Try it anyway

Although I do not recommend you to use template on your website, try it. Try to hack it if you can. If you succeed in part you’ll learn a lot on the way.

 

"This post is written for Prague College students. Feel free to explore the topic with us."