Front-End Development Using WordPress

First things first

WordPress was initially a blogging platform, but has expaned its usage to also include creating websites.That, and a great community, makes it an excellent CMS. To those of you who don’t know what a CMS is, it’s a piece of software for managing content, hint the name Content Management System(CMS). You’ve probably heard about other CMS’ like Joomla, Magento, Drupal etc. and if not, that’s fine. There are a few of CMS’ out there. What’s important to know is that it can make life easier for two types of people: Webdevelopers and people with less to no programming experience. The last part is especially true, since WordPress is more or less a GUI for front-end (and back-end also) development, but with lots of room for programmers to implement their own custom code.

Having build websites using WordPress professionally for 1 year, I have come to see the pros and cons about using it as a tool for front-end development.

General usage

Once you have installed WordPress on your website, all you need to do is pick a theme from the theme library and then you’re more or less up and running.

There are a lot of free themes, which are pretty and work well with whatever type of website you are running. WordPress offers widgets, which are basically blocks of code that can be placed at some given points on your website, where they will serve a design og functionality purpose. Think of it a bit like the adds you see that are placed near the edges on different websites. If you want a theme with more customizable features or just an extra spicey look, you can try purchasing one from the theme library or another similar site.

Next step is finding out what functionality you want on your website. Let’s say, for starters, that you at least want people to be able to contact you via email. You can just add your email in the footer, but why not try a contact form instead? You can find something like that in the “plug-in” library. Like the theme library, you can enter it from inside WordPress (the back-office) and search and install from there, or visit it “manually” from outside WordPress.

The plug-in library has a ton of plug-ins for all kinds of additional functionalities like measuring website traffic, GUI front-end page builders, security, and more. To stick with the contact form, Contact Form 7 is a plug-in that allows you to add a contact form on a page. The plug-in makes it easy to configure the front-end and back-end part of it, which you can do in the WordPress back-office. I won’t go into too much detail with configuring this plug-in, but from what I’ve already told you, you’re basically up and running with a functional contactform that includes email.

Creating new pages and navigations for your website is easily done in the back-office of WordPress by hitting “pages” -> “add new” and do your thing from there. Once you’re done you need to hook it to your active navigation and voila!

All of this works similarly when using WordPress for blogging.

Modifying and customizing

Let’s say you don’t like the way your current theme colorizes your text and headings (I know, simple problem, but let’s not make it too complicated). If the option to change this is not included in the theme’s GUI’s customizing menu, you can change it yourself by using a FTP client (I use FileZilla) to access your webserver and edit the theme’s CSS file. Furthermore, if you for some reason don’t have FTP access you can download a plug-in called “Custom CSS”, which allows you to add CSS from the back-end of WordPress. Like I said earlier, WordPress has plug-ins for almost anything.

The WordPress “engine” comes with built in functions that can help you customize your website’s pages even more. A simple example of this is the is_front_page() function. The functionality is just as the name suggests; If the page you are viewing is the frontpage/homepage, this function fires and does whatever you tell it to do. Let’s say you want a full width hero image on the frontpage only. Here you can use the is_front_page() to complete this behaviour.

The programming language in which you use the built in functions is PHP. WordPress is built in that. You can use JavaScript and various frameworks with PHP, but the built in functions is mainly used with PHP. If your goal is to take a theme and make it really custom to your needs (or a client’s), knowing PHP is key. Just beware that if you hardcode PHP code into the themefiles it will get erased next time that theme updates. To prevent this you use child themes. In short this makes a copy of your theme where you can modify all you want without having it deleted after an update.

The pros and cons

Aside from a large community, plug-ins for everything and the ton of themes, WordPress has one more great thing about it: it’s open source and free!

Since setting up WordPress is fairly simple and comes with a lot of powerful tools for website building, it’s a great CMS for freelancers of all kinds and small businesses. Small businesses that haven’t put themselves online yet and/or has a limited budget, can utilize WordPress, and with a little Youtube’ing and Google’ing, manage it without having to pay a developer or webbureau to do it for them. You could also be a company with only one or two developers employed, where you make use of WordPress for website building in order to keep a good pace, instead of spending weeks on building a custom website from scratch with for example the LAMP stack.
In terms of administration, WordPress can let you have multiple users for a single website. For example you have the admin, who manages the development of the website and then you have an editor, who manages the content itself like text, imagery etc. An editor does not have the ability to change much other than content related stuff from the WordPress back-end, whereas the admin has access to all of WordPress’ back-end functions.

All the above mentioned aside, WordPress does have its flaws. It’s important to know that basically anyone who knows how to code plug-ins and themes, can add them to WordPress. Security wise, when it comes to plug-ins, you have to be wary of what you choose to install. Usually a plug-in with a lot of installs makes it more”legit”, but if you find a plug-in that fits your need, but only has a few installs, you should make sure to check out the reviews and page of that plug-in. The plug-in could be malware or just lack updates, which can be exposed. Plug-ins with a lot of installs usually update regulary and reduce security flaws and exploits.
You can encounter customization issues when trying to customize a theme to fit your websites need, be it design or functionality. If you edit the theme files, or better yet the child theme’s files, you need to be careful not to break the theme itself. This mostly comes down to how experienced you are with programming, but it’s relevant to point out.

TL;DR list of pros and cons:

pros:

• Great tool for website building or blogging
• No programming experience required
• GUI for managing the front-end back-end
• Good for freelancing and small companies
• Can handle multiple users like admins and editors
• Open source
• Large community

cons:

• Security flaws in the plug-ins
• Customization can sometimes be limited

You either like it or you don’t

To round off this topic it is my experience that either you like what WordPress, or other similar CMS’, offers in terms of development. I remember starting out using it in early January 2018 at my company. I was used to building websites from scratch, so suddenly using WordPress felt like it took a lot of my freedom in terms of designing. It was troublesome to get things placed where I wanted them on the websites and it seemed complicated to do “simple stuff”. This feeling towards WordPress slowly dissappeared the more I used it, because I started to see how WordPress worked. I guess you can say that about a lot of things in general. You just need to learn it, right?

Anyways, thank you for reading. If you haven’t tried out WordPress, give it a shot. If you have any questions regarding this topic feel free to reach out.