Modifying Your Own WP Theme On Your Computer
-
I’m betting there are lots of folks out there that have the same idea I had; after signing up for a free WordPress.com blog and maintaining it for a while, you realize you really like blogging and have a lot of theme design ideas you would like to implement. But then you find out the free blog is limited to how much it can be modified. You’ve convinced yourself you can do it, but don’t exactly know where or how to start. You know almost nothing about php and Cascading Style Sheets (CSS), but you are willing to tackle it. However, you don’t want to purchase your own domain, activate your favorite theme and play with it on-line for fear you might fail.
If any or all of this has crossed your mind, I’ve may have some help for you. I had my free WP.com blog for over a year where I published my views on the news headlines of the day. I found I really liked doing it and it became somewhat successful, therefore I wanted to customize a theme to fit my eye. So I started researching.
The first thing I did was extensive research on the available free blog theme publishers. I learn very quick that WordPress was the one I wanted to use, as WP offered the most options for what I had in mind, plus I was already very familiar with WP. That was step 1. Step 2 was to find out how to do all this without having to do it online with a for-fee hosted domain (my ignorance said there should be a way). So I started looking. In researching this I stumbled across (no pun intended) MoWeS Portable by CH Software who offers a free download for making my computer think it’s a host, thus enabling me to have a “domain” on my computer (there may be others out there). “MoWeS” stands for Modular Webserver System (was WOS, Webserver On Stick). It comes loaded with Apache, MySQL and PHP. Knowing absolutely nothing; I mean nothing; about any of this, I was confused about the software’s instructions that I had to configure my own “wp-config.php” file after I downloaded WP and place it in the “www” folder. To begin with, I didn’t even know what they meant by the “www” folder, although it was obvious this was referring to the World Wide Web, and I certainly had no idea what config.php was. So I decided to research that before I downloaded the software. As is were, that turned out to be rather simple; there’s plenty of sites out there that will give you the four simple steps required for configuring the wp-config.php file (there’s a “wp-config-sample” in the WP download). Editing wp-config.php is a good place to learn how, but there are so many other sites that can help too. When I was looking around, one MoWeS Portable download site even offered to include WordPress and the wp-config.php file with the MoWeS download. (But now it appears that the home site link above of MoWeS Portable includes WP in their download, as well as other top theme publishers.) At this point, I was reassured I could do this.
I decided I didn’t want to have the MoWeS Portable software on my computer hard drive for fear it my confuse my hard drive and cause some unwanted problems (I’m a very cautious person). So I downloaded MoWeS Portable to one of my external storage devices I use for backup, and then I purchased a 2 GB stick ($12 at Wal-Mart) and just cut and paste the folders & files to that. Also, this allowed me the option of taking it with me to be used on other computers. After all, it is designed to be “Portable”.
After getting my “host” on my storage device, I downloaded my preferred WP theme. After I unzipped it, all I had to do was place the folder in the “themes” folder in the “www” folder (by now I had found out what the latter was; duh! – it came with the “host” download). At this point I had to start “learning”. As a senior citizen (over 65), I’ve had a lot of success in my life as a self-teacher in conjunction with minimal help & formal instructions (I’m a “trial & error” kind of guy on things that aren’t fatal). And as we all know, there is nothing you can’t find on the web.
Should you decide to do this, let me give you the best advice I can give; use the heck out of WP.com and WP.org FAQ’s, forums & other info. It’s like they’ve anticipated the very thing you need to know, no matter what it is. While some of the info may be slightly outdated due to the many upgrades to WP and WP themes, in most cases it is easy to deduce what you have to do in order to apply a particular help instruction. And remember, WP.org is where support is for your own hosted WP blog, not WP.com. However, WP.com has tons of info that will help you on your project. After you have exhausted all other efforts, WP support is pretty darn good. I never had to ask them for help in modifying my theme, and I did some very extensive modifications for a beginner. (And remember, I knew absolutely nothing about any of this before I started.) But I did contact support with a couple of uploading questions and some clarifications on redirecting my old blog once I was ready to do that.
You must remember, doing this with a computer “host” is all off line and can be done at your leisure; and if you really mess up a theme, just remove it and start with a clean copy (I had to do this only once very early on). Don’t be afraid of the “trial & error” system. You learn an awful lot this way. And do not set a deadline for yourself. Haste always makes waste, and that applies no place better than it does to this kind of work. Make the project a joyful one, take breaks from it, and don’t be afraid of failure; consider them just temporary setbacks.
Another advantage of having a local hosted “domain” on your computer (or storage device), is when you are finished modifying your new theme and got everything the way you want it, you can export your post, pages, tags, categories, library, etc. from your old online blog and import them to your computer blog to test everything out and see how it looks. I found I needed to fix a few things after I imported. This also allowed me to reorganize my tags & categories, and re-tag and/or re-categorize necessary post, etc. Then when I was ready to import to my new online blog I exported from my computer blog and imported that to my new online blog.
Finally, another advantage of using a computer hosted “domain” is that once you have your new blog on line and you want to make some theme changes, you can test them out on your computer hosted “domain” first until you get the results you want before modifying your online theme. I’ve already used this option several times. This also allows you to keep a “mirror” image, so to speak, of your online theme. In addition, this acts as another backup (But then again, I’m a backup addict).
I am a very deliberate and careful person. As such, I probably averaged about 4-6 hours a day working on my project (a few days may have been more hours, but a lot of that time was spent in educating myself). I completed everything in about 45 days from start to finish (including taking time off over the Thanksgiving, Christmas, and New Year holidays), and I made a lot of changes to my theme; many of them trying things out first one way, then another way. This included all the widgets & stuff in the widgets and trying out plugins, as well as the many “neat” things I included in my theme. This involved moving & testing margins, borders and padding’s, different font types and colors, different background colors, placement of things on the site, designing my own header pictures, writing one additional php file from scratch, & a whole lot more. Many times, after doing something, I would look at it for a day or so to make sure I really liked it. I even added my redesigned RSS link and subscriber links (all I had to do once I was on line was update those links). And all this is done without having to worry about messing up your online blog. I even spent a fair amount of time just playing with things to see if I could actually do it. If you are a quick learner, or already know a little about php and/or CSS, you could finish sooner, especially if you don’t want to get too fancy. But I had an awful lot of fun doing it, and I have always been at my best when I am challenged by something I know absolutely nothing about. The biggest thing I learned is that php and CSS is basically limited only to your imagination.
The following is a list of things I would suggest you do before and during your project.
1. Starting with your initial research, add any website to your favorites you think you may need for reference. Then send the web site to your desktop and place it in a folder. Organize those sites in topic-specific folders and keep those folders in a single master folder. You will find this to be very helpful and easy to use as you proceed with your project. I probably had 15 or more folders with probably 80 web sites, and a couple of dozen word documents & notepad files in my folders by the time I was finished. Some web sites I probably never used, but this system will really expedite your efforts. (You can delete some of those folders & notes after completion of your project if you like.) You may find the need to reorganize those files & folders from time to time as you go through your project. It’s also a good idea to keep a “Notes on this folder” file in each folder.
2. Backup often – I started a single folder for my entire project and included a backup folder of the external storage device. I backed up daily. Also, before I made major changes like downloading an updated version of WordPress, I would backup the entire project before those changes. With nothing but this project on the external storage device, I would just copy everything (including the MoWeS Portable stuff) on the storage device and copy it to a folder on my computer. (I told you I’m a backup addict). And if you do download an updated version of WordPress, don’t forget to copy the “wp-config.php” file from the old version first and put it in the new version.
3. Study the downloaded MoWeS Portable folders & files, and become familiar with them before you start.
4. Study the WP folders & files, theme folders & files, and especially the php files before starting. Become familiar with what’s in each of them. Remember, this is a Cascading Style Sheet, and anything you do can affect anything in the sheet that follows.
5. Learn some basic stuff before you start, like what tags are and how to use them (WP has a lot of info on this, and there are hundreds of other sites that offer help, many in tutorial format). I will give you just three examples that I learned through the trial & error process (I didn’t learn any basic stuff before I started, so don’t be like me). I wanted to change the font of a particular text. After I did that, everything that followed picked up the same font & I couldn’t understand that. I didn’t know about placing “</font>” at the end of the tagged text. (The forward slash in front of the word tells the new font to end there.) And I wanted some stuff centered, but not other stuff. Not knowing that “</center> was required to end the centering process, I really got confused when everything below what I wanted centered was also centering. So that took up a lot of my time that otherwise wouldn’t have had I learn some basic stuff before I started. Also, don’t delete anything in the php file that you don’t want in your theme unless it is absolutely necessary; use the “comment out” command, which is “/*” at the beginning and “*/” at the end (without the quotation marks). You may discover later that you want it back in your theme.
6. Don’t throw (delete) anything away. Keep everything even though you may think you don’t need it any more. Clean up after you are finished and on line.
7. There could be up to 15 or more php files in your theme. Before modifying a php file, which is in “notepad” format, copy the entire php file in the theme editor and paste it to a word document. Then use the word document to record any changes you make to a php file. As I modified a php element in the theme editor and got the results I wanted, I went to the word document and highlighted in yellow only the parts of the element that I changed or modified. Then I copied the modified element from the php file in the editor and pasted it just under the unmodified element in the word document for comparison later if necessary, & highlighted that in yellow. Then, in red type, I told myself what changes I made, why I made the changes and what the results of the change were. You will find this is very helpful in more ways than you can imagine.
8. If you need to add an element or command to a php file in the theme editor, type it in notepad first. Use the “tab” key to tab over as far as you need before typing the element. Then when you copy the element from notepad, include the blank space in front of the element. When you paste this into the php file, set your cursor to the far left before pasting. The reason for this is the php file in the editor does not respond to the “tab” key. Then paste a copy of this into the appropriate word document file in the appropriate location, and highlight that in a different color, say green. These different highlighted colors will help later on if you need to review what you have done.
9. Keep a clean copy of your theme. You may find you have messed up a php file so bad it won’t work any more. If this happens, just throw the php file away and paste a clean copy in the theme folder.
10. Don’t forget to use your “.custom” file in WordPress (that’s “dot” custom). It really is as easy as the instructions say it is. In case you aren’t familiar with what that is, it’s a file that WordPress has placed in their themes where you can add a copy of all your customized elements from the php files. By doing this, your modifications will stay with you when you upgrade your theme and/or WP version. You certainly don’t want to have to redo all your php files when you upgrade.
11. Make reference notes as you go along. Don’t rely on memory. You will find that those notes will come in handy.
12. If you put some neat stuff on your blog that is in html, paste a copy of the html’s in a notepad document, name the document, and keep them. It becomes very handy when moving things around on your theme to see how it looks.
13. When you upload a picture or file to WP library for placement in your theme, make a copy of the link to the file and paste that into a notepad. Name that notepad and keep everything from your library in it. This, too, will become handy and save time when moving things around.I’m certainly no expert on this subject & never expect to be, but if there are any questions I can answer, leave them in the comments. I will check back often, and may some others have additional ideas.
I will be posting a follow up to this, which will be about how easy it was to select a host and sign up, upload my theme & import my blog, and get it all rolling. And, placing a redirect on my old WordPress blog (of course, the latter requires a $10 per year upgrade at WordPress, but well worth every penny of it). As it turned out, all this was the easy part.
-
-
a simpler way is to choose the WordPress theme that best fits your eye, and then go into the CSS editor and change whatever you like to make it custom. Keep in mind, the changes will have no affect unless you purchase the CSS upgrade which is $15 dollars U.S. per year.
That’s what I did.
- The topic ‘Modifying Your Own WP Theme On Your Computer’ is closed to new replies.
WordPress.com Forums 