WordPress

I didn’t install any ready-made themes or editors. Instead, I used Understrap starter theme, then I configured and customised it to fit the purpose of this coursework. I called my bespoke theme: “Dynamic Web Technologies”, after the initial configuration I manipulate the CSS and other WP elements by accessing the PHP (with the help of developer Docs) code and other add-ons to take shape and functionality it has now.

I tried to use as little plugins for this website as possible. Reducing the dependence on other’s code is always a good idea, especially if you know how to do it by WP functions and PHP code. The list of plugins that I couldn’t avoid can be found here.

The customized theme comes with five main widget areas: Two sidebar widgets, one full size “hero” widget and two dynamic widgets area above and below the main content.
I used the Hero Canvas to add in my carousel in the homepage without using any plugins, but by editing the widgets to add photos and titles.
I also added a Top Full and Footer Full ones.
All the previous widgets can simply be edited from the backend by accessing Dashboard>>Appearance>>Widgets and select what widget to edit.
Then inside the correct template page, we can use the PHP code to insert that widget in place by using for example:

<?php get_template_part( 'sidebar-templates/sidebar', 'hero' ); ? > To know more about the Understrap theme widgets please follow this link: https://understrap.github.io/#widgets

I created a new post type called “Modules” to hold all the modules I’ve studied in the last four years and the marks I’ve got. The way I did that was by adding a function to the WordPress functions.php file and executed it, here is the code:

I also added a custom dash-icon to it, so it stands out on the dashboard. The icon has been found on: https://developer.wordpress.org/resource/dashicons/#id-alt

I extracted the modules’ data on “MY ACADEMIC RECORD” JQuery Exercise.

>>

I used ACF or Advanced Custom Fields, which allowed me to add extra content fields to the original WordPress edit screens, hence adding more functionality and ability to customise and style the web-page elements.

Here, for example, I added a banner image to go with any page using the “Inner Pages Template”, so we can change banner image throughout the website right from the WP dashboard:

Here is the code that I used:

This is a required component by the coursework brief, I built up a store using WooCommerce plugin with two products, and I used another plugin called WooCommerce Order Test to test the checkout process.

Finally, in order to mimic the payments and test the checkout payment functionality of the store; I’ve enabled “PayPal sandbox checkout” option from WooCommerce settings panel after I signed up for a developer account.

The store can be accessed via the top navigation bar or from here.

At the very bottom of the page where it read “Proudly powered by WordPress | Theme: Dynamic Web Technologies by B00316703.”

I added the dwt_site_info() function into hooks.php file and executed it by do_action( ‘dwt_site_info’ );

It is important not to forget to style and design this page as it happens all the time that broken links or bad typing into the address bar would lead the visitor to the unknown and give him a bad impression about the website and frustrate his browsing experience.

A good 404 page should help the users either find the content they are looking for or reorient themselves on the website.

Try my 404 here: https://appsology.co.uk/dwt/wordpresss/

Any paid-for theme will offer this as a standard feature, for my customized theme, I added it myself (for free).