This article only applies if you're running a self-hosted WordPress website. It does not apply for wordpress.com sites!
One of the reasons WordPress is so popular is because of the plugins that offer your website advanced functionality with a simple download and set up. With the support of the plugin library, you're able to do advanced digital work with minimal effort - that's a win for everybody!
But there may be times you have to access the source code of your website. If your site is attacked with malicious malware, you update a plugin, and it crashes your website or you just want to make some advanced customized changes, editing your source code may be the next step for you.
There are many ways to access the source code of your WordPress website. For WordPress beginners, here are the two methods you can use right now.
And if you're looking for any technical help with this, here are 15 WordPress maintenance companies that can do the job.
NOTE: You can do more harm than good to your website by updating source code incorrectly. Please be careful!
Content Upgrade
Free Source Code Security eBook
[4 Pages] The 21-Step Checklist to
Ensure a 99.9% Secure WordPress Website
Editing HTML in WordPress
First things first: let's discuss how to access HTML code in WordPress. You actually don't need to access the source code of your website if you want to edit the HTML on a specific page or post. All you have to do is move from the Visual Editor to the Text Editor on the backend of any page or post and it will show the HTML working behind the scenes.
From the Text Editor, you can access, change, and update the HTML on any page or post with just a few clicks.
But what about editing the HTML on your homepage? You can usually do this under Appearance > Widgets and adjust the content there in the individual widget areas.
In some themes, the homepage acts as it's own individual page so if you can't edit it in the Widgets area, you may be able to find the homepage content under Pages.
If the homepage acts as an individual page, you can also click Edit Page in the top admin bar from the homepage.
If neither of those options work for editing the HTML on your homepage, you may be using a page builder or theme with a built-in homepage editor. If this is the case, you can reference the documentation provided to you with the theme or page builder.
Editing PHP and CSS in WordPress
Can you do CSS edits with WordPress? What about PHP changes? Yes and yes!
There are two main ways to access the raw theme files (PHP) and Cascading Style Sheets (CSS) of your WordPress website.
1. The WordPress Code Editor
If your WordPress site is still up and running and you're able to access the backend, you can find the site's source code via the WordPress Editor under Appearance. If Editor doesn't appear under Appearance, your theme may be functioning a bit differently; check to see if your site is using a theme-specific WordPress code editor located somewhere else in your dashboard.
Here, you can access the PHP theme files and make any changes you see fit to the design and structure of your website. Be sure you know what you're doing before making changes to anything in this area, as a wrong move can easily cause your website to crash!
If you have multiple themes installed or are using the combination of an adult/child theme, you can switch between your different themes in the upper right-hand corner of the Editor.
To select specific theme files to edit, you can choose from the list on the right side of the Editor. For example, if you want to make changes to the header across your website, you can open the header.php file.
2. File Transfer Protocol (FTP)
FTP is a way to access the entire source code of your WordPress site. It's also pretty necessary when you're doing any PSD > WordPress work.
1. Create FTP Credentials
First, you'll need to create FTP login credentials through your hosting provider. If you don't, you can usually create them in your cPanel under FTP Accounts.
- Add a unique identifier for your FTP username. Your FTP username will be uniqueidentifier@yourprimarydomain.com, so copy/paste it to a secure location.
- Create a unique and strong password. We recommend using the password generator to create a password that scores 100/100 on a strength score. This will be your FTP password, so copy/paste it to a safe location as well.
- For the Directory extension, always use public_html.
- Your Quota should always be Unlimited.
- Click Create FTP Account and you're done!
If you have trouble creating FTP login information, reach out to your hosting provider via livechat or email support and have them help you create it.
Feel free to Google "[your hosting provider] FTP" and a helpful article should pop up. For instance, SiteGround provides a ton of support here.
2. Download FileZilla
3. Log In Through FileZilla
Open FileZilla, otherwise known as a WordPress source code editor, and enter your FTP host, username, and password. Your username and password you've already created and your host should be listed somewhere in your cPanel.
If your cPanel lists an IP Address, you can use that as the host as well.
Click Quickconnect and you're in! You now have access to your WordPress source files and can make HTML, CSS, and PHP edits as you see fit. Simply right-click on any file you want to edit and select View/Edit.
Once you've made the changes you want (again, be careful), you can save the new file in place of the old one.
These are the best ways to access the source code of your WordPress website and make core changes to HTML, CSS, and PHP. Alongside the power of the seemingly endless plugin library, this will give you the ability to fully customize everything about your site!
Content Upgrade
Free HTML, CSS & PHP Security eBook
[4 Pages] The 21-Step Checklist to
Ensure a 99.9% Secure WordPress Website
Hi! It means a lot to me that you wanted to know who wrote this. I’m the Head Buff at WP Buffs. I’ve been featured on Indie Hackers, WP Elevation and Kinsta. I also do the ridiculous podcast Walking Marvin.
