WordPress Day 2 1 Day 1 Review Describe the difference between a - - PowerPoint PPT Presentation
TWD 25 WordPress Day 2 1 Day 1 Review Describe the difference between a static website, a dynamic website, and a content management system. Describe the layers of a CMS like WordPress. Compare basic aspects of the most used content
1
Describe the difference between a static website, a dynamic website, and a content management system. Describe the layers of a CMS like WordPress. Compare basic aspects of the most used content management systems.
2
Install a WordPress website on a local server. Configure and customize a WordPress website using the Twenty Twenty WordPress theme. Add content to a WordPress website.
3
4
Install a WordPress website on a live server. Define the three primary reasons for using HTTPS. Migrate a WordPress website from a local server to a live server.
5
6
A local server is only on your computer and no one else can access it. A live server is “on the internet” so it can be accessed from any device. Now we are going to work on a live server...
7
Installing WordPress on a live server will generally involve…
8
from WordPress.org.
9
and add the database name, username, and password to connect the files and database.
your Portfolio via FTP (FileZilla).
process.
10
Download the video tutorial showing how to install WordPress on a live/remote server from the Program Files FTP server. 10-WordPress-Development / Video-Tutorials
11
Download & extract the core files from WordPress.org.
12
cPanel is the Control Panel on many hosting servers. cPanel is your portfolio site’s online dashboard. cPanel access (replace “USERNAME”):
https://USERNAME.bcitwebdeveloper.ca/cpanel
Your password will be your BCIT ID.
On a live/remote server, phpMyAdmin has no option to create or drop databases. Creating and deleting databases is done from MySQL Databases in cPanel.
13
14
Name your database and click Create Database.
Note: Your database will begin with a prefix created by the server, you are only typing the end of the name.
15
Create a user for this specific database. Use the password generator then copy/paste the password somewhere temporarily.
Note: Your username will begin with a prefix created by the server, you are only typing the end of the name.
Database Users ≠ WordPress Users Do NOT use your personal passwords for Database Users because anyone with access to your files can read it when you paste it into wp-config.php. Always use the Password Generator when setting passwords for Database Users.
16
Live/Remote
Database users are created by you for specific databases.
Local
MAMP - root / root WAMP - root / ‘’
17
18
Select the Username you created and the Database you created and click Add. On the next screen, check All Privileges, then click Make Changes.
19
Check under the Current Databases section. Verify that the Database User you created appears next to the Database name you created.
20
In the newly extracted “wordpress” folder, rename wp-config-sample.php to wp-config.php. Add info from cPanel… ...don’t forget the prefix for the database name and user name.
21
If you lost the password you can regenerate it in cPanel. Note: The hostname will almost always stay localhost even on a live/remote server.
Most hosting companies provide phpMyAdmin by logging into cPanel as a non-super user. Though it's on a remote server, it still gives the server name as localhost because MySQL and this phpMyAdmin are local to each other.
22
A server running MySQL version 5.5.3 or higher should have the server connection collation set to utf8mb4_unicode_ci. If earlier, it should be set to utf8_general_ci or utf8_unicode_ci.
23
24
Rename the extracted wordpress folder and then upload the folder to your portfolio server with your FTP application (FileZilla).
25
Open the site in a browser to begin the installation process. Access live site:
https://USERNAME.bcitwebdeveloper.ca/FOLDER
26
Select the language, then fill in the details.
Note: If you are asked to input database details, then you have not created the wp-config.php file.
27
Add /wp-admin to the end of any WordPress site URL to access the admin dashboard.
Tutorial:
https://www.linkedin.com/learning/wordpress-5-essential-training-site-administration/admin-panel
28
Always download and extract a new core file pack from wordpress.org. The database name/user/password is NOT the same as your WordPress site username and password. Do NOT use 'admin' as a WordPress username. Use longer and safe passwords.
Check with your host to determine their default values for uploading files. Example: SiteGround sets it to 128MB but you can increase it by editing the php.ini file. http://php.net/manual/en/ini.core.php
29
30
Every website you upload to a server should be using HTTPS instead of the unencrypted HTTP. Let’s look at why this is needed and how to do this...
31
HTTP is not encrypted and is able to be read and manipulated by a third-party. For example:
32
HTTPS adds another step before transmitting data: the handshake. The handshake verifies that the server and browser are both who they claim to be through the use of TLS/SSL Protocols and Certificates. Then data is transmitted in an encrypted connection.
33
Security - Encryption of data between the server and the browser. SEO - Google uses HTTPS as a ranking factor. Performance - Every major browser requires HTTPS to use HTTP/2.
34
Let’s Encrypt launched in December 2015. It’s a service that generates free and auto-renewing TLS/SSL Certificates. Many hosting providers use Let’s Encrypt:
https://community.letsencrypt.org/t/web-hosting-who-support-lets-encrypt/6920
35
click on Let’s Encrypt.
36
37
1. Edit the .htaccess file from your WordPress directory. 2. Add the following code to the top of the .htaccess file and upload the file:
38
Note: Copy code from https://wp.bcitwebdeveloper.ca/instructor/force-https/
Every website you make going forward should be served over HTTPS and forced to only use HTTPS. If a hosting provider doesn’t offer free TLS/SSL Certificates… find a different hosting provider.
39
40
New Server, New Domain
Example: localhost/website to website.com Example: website.com to new-website.com
New Server, Same Domain
You switch hosting services but URLs remain the same
Same Server & Domain, New Folder
Example: Rename folder Example: Move site from a subfolder to the root
41
This is a full migration. For example... Local server to remote server: localhost/website to website.com Remote server to a different remote server: website.com to new-website.com
42
Let’s migrate the Vancouver site from our localhost server to our live server. Note: If you haven’t finished the tasks from yesterday you can still do them after the migration so please follow along.
43
We will use the paid WordPress plugin WP Migrate DB Pro provided in the Program Files FTP. Please download all three zipped folders now.
44
WP Migrate DB Pro allows us to connect WordPress websites so we can Push and Pull databases and files between both WordPress websites. We will treat our localhost site like a staging or development site, and our remote site like a production or live site.
45
46
enter the license key on both WordPress websites.
47
Themes and Push.
48
Go to Plugins → Add New. Click on Upload Plugin. Click on Choose File and Install the plugin. Repeat for all three plugins. Do this on both sites!
49
Go to Tools → Migrate DB Pro → Settings. Copy and paste the provided license key into the Your License field
50
Confirm that all three plugins are activated and up-to-date on both sites.
51
On the remote site, go to the Settings tab:
Info.
permission.
52
On the local site, go to the Migrate tab:
Connection Info.
53
Choose your settings for:
Check Save Migration Profile then click Push & Save.
54
Go to the remote site on the live server and it should be identical to the local site. Note: After clicking Push, the remote site database is wiped completely. Your WordPress login for the remote site will now be the same as the local site.
55
Use the following tutorial to review these steps and the WP Migrate DB Pro interface. Tutorial:
https://www.linkedin.com/learning/wordpress-migration/migrate-with-wp-migrate-db-pro
This is a full migration. For example... Local server to remote server: localhost/website to website.com Remote server to a different remote server: website.com to new-website.com
56
If you have a new hosting provider but you are keeping your domain name the same. All of the previous steps apply.
57
Example 1: example.com/new to example.com Example 2: example.com/new to example.com/old Move your WordPress installation into the desired directory on the server or rename the directory. Use the Search Replace DB tool to update all URLs in the database.
58
Download and extract the Search Replace DB tool:
https://interconnectit.com/products/search-and-replace-for-wordpress-databases/
Upload the folder to the root of your WordPress installation and rename it something easy to type.
59
Navigate to that folder in your browser. Fill in only the first two fields. Click “dry run” to test. Click “live run” to run the search and replace.
60
Here is an example of what to type into the two fields: Search for: example.com/vancouver Replace with: example.com/vancity
61
After using Live Run, login to your WordPress site. Go to Settings → Permalinks and click Save
This will flush the permalinks and make sure all of your links work.
62
63
After the program, you will not have access to the WP Migrate DB Pro plugin unless you purchase it yourself. You can use the Search Replace DB Tool to do a manual WordPress migration. A video tutorial is provided in the Program Files FTP server. 10-WordPress-Development / Video-Tutorials
64
Install a WordPress website on a live server. Define the three primary reasons for using HTTPS. Migrate a WordPress website from a local server to a live server.
Install WordPress themes and plugins from the WordPress directory. Create user accounts on a WordPress website. Complete and submit WordPress Site #1.
65
66
Plugins are custom functions created to extend the core functionality of WordPress. Developers create them and post them on the wordpress.org plugin directory where you can find information and reviews, and download them. If you add the functionality and you don't like it you can simply deactivate and delete the plugin.
67
Let’s install the Contact Form 7 plugin: https://wordpress.org/plugins/contact-form-7/ Create a Contact page and add the Contact Form to that page.
68
If a plugin ever breaks your WordPress website, simply delete the files by going to… wp-content/plugins/ ...find the offending plugin and delete the folder.
69
To review what WordPress plugins are and what they are capable of, check out the tutorials below.
Tutorials:
https://www.linkedin.com/learning/wordpress-5-essential-training-site-administration/plugins-what-they-are-and-how-they-work https://www.linkedin.com/learning/wordpress-5-essential-training-site-administration/install-activate-and-manage-plugins
70
A WordPress theme is the collection of files that decides what your website looks like on the front end and how it behaves. WordPress core developers create well coded and responsive themes that ship with WordPress: Twenty Twenty, Twenty Nineteen, Twenty Seventeen, Twenty Sixteen, etc...
71
By changing the theme, you're changing not only the appearance of your WordPress site but often also adding, augmenting, or subtracting functionality. Always look through the theme documentation,
WordPress Themes Directory: https://wordpress.org/themes/
72
Free themes – Only use themes from the WordPress.org directory if you want a free theme. Premium themes – Many work great. Some have special theme options and customizations built in that can break your content if switching themes later.
73
Let’s install the Twenty Twelve theme: https://wordpress.org/themes/twentytwelve/ Activate the theme and check the front end of your website to see the differences. Then switch back to the Twenty Twenty theme.
74
To review what WordPress themes are and what they are capable of, check out the tutorials below.
Tutorials:
https://www.linkedin.com/learning/wordpress-5-essential-training-site-administration/themes-what-they-are-and-how-they-work https://www.linkedin.com/learning/wordpress-5-essential-training-site-administration/preview-install-and-activate-a-theme
75
Every User account on a WordPress site must be assigned a Role. Roles give the site owner the ability to control what users can and cannot do within the site. WordPress has six predefined roles with specific capabilities...
76
Administrator – access to all the administration features within a multisite / single site. Editor – can publish and manage posts including the posts of other users. Author – can publish and manage their own posts. Contributor – can write and manage their own posts, but cannot publish them. Subscriber – can only manage their profile.
77
Subscriber Contributor Author Editor Administrator Manage profile Write own posts Publish & edit own posts Manage all posts Manage all settings Manage admin settings
78
More information on Roles and Capabilities:
https://wordpress.org/support/article/roles-and-capabilities/
79
Let’s create a second user account on our website with the role of Author. Use an incognito or private browsing window to login with this second account and see what the Author role is capable of doing.
80
To review what WordPress users and roles are and and the how to use them properly, check out the tutorials below.
Tutorials:
https://www.linkedin.com/learning/wordpress-5-essential-training-site-administration/how-wordpress-handles-users https://www.linkedin.com/learning/wordpress-5-essential-training-site-administration/add-and-manage-users
81
To change the email address, password, name, and more for your account or any other account on your WordPress site, use the tutorial below...
Tutorials:
https://www.linkedin.com/learning/wordpress-5-essential-training-site-administration/user-profiles
Install WordPress themes and plugins from the WordPress directory. Create user accounts on a WordPress website. Complete and submit WordPress Site #1.
82
83
Create a WordPress Site Configure WordPress Add Content to WordPress Add WordPress Plugins Select a WordPress Theme Create a WordPress User Migrate the WordPress Site
84
If you have not already, complete all of the tasks listed
After that, follow the steps here:
https://wp.bcitwebdeveloper.ca/instructor/assignment-wordpress-site-1/
85
Before class tomorrow, please setup another local WordPress site according to the next slides and the video tutorial provided in the Program Files FTP server: 10-WordPress-Development / Video-Tutorials Give yourself 30 - 45 minutes this afternoon or this evening to complete this setup.
86
server.
‘mindset’. (If on Windows, make sure you do not have this folder nested!)
87
a. https://wp.bcitwebdeveloper.ca/instructor/site-content/twd-starter-theme.zip
mindset-theme, copy it into the themes folder.
WordPress Settings.
88
About, Contact.
Ipsum and the provided images:
a. https://wp.bcitwebdeveloper.ca/instructor/site-content/mindset-images.zip
Blog.
89
a. Reveal IDs - https://wordpress.org/plugins/reveal-ids-for-wp-admin-25/ b. Show Current Template - https://wordpress.org/plugins/show-current-template/
That’s it! You’re all set for tomorrow!