How to Use Microsoft Expression With WordPress
By Adele Eliot
Microsoft Expression is a software program that allows you to design and create your own Web pages. Whether you have coding experience or are new to using CSS, Microsoft Expressions can help you design professional looking Web pages. WordPress is a website platform that helps you set up your blog. Once you have a WordPress blog, you can choose to move the site to your own domain name, customize the site with WordPress plug-ins and use Microsoft Expression to create a theme.
Set up an account with WordPress or log in to your existing account. Install WordPress onto your computer by clicking "Download" and following the instructions on your screen. Ensure you know where the WordPress files will be stored on your hard drive so you can locate the folder later.
Create four different pages called "Home," "About," "Contact" and "Blog" using the WordPress dashboard. You can do this by clicking on "Pages," then "Add New." On the "Blog" page, you also will need to create five different posts and two different post categories. Create new posts by clicking on "New Post" in the dashboard and assign each post a category by clicking on the "+" sign under "New Categories" when writing a new post.
Choose a customizable theme for your WordPress blog using the themes on the site. Under "Appearance" on the dashboard, click "Themes" and pick the design you want from the list. You will be able to tweak this theme using Microsoft Expression, but it should be close to the kind of design you envision for your blog.
Open Microsoft Expression and create a new blog using the software. The site your building should be saved in the root folder of the WordPress installation files. Remove any existing CSS code on the Expression page so that it is blank. Then, open your existing Wordpress blog in a normal Web browser and display the source code. In Firefox, you can do this by pressing "Ctrl + U" and in IE8, go to "Page," then "View Source." Copy the source code by highlighting it all and pressing "Ctrl" plus "C" (or "Command" plus "C" on a Mac).
Paste the source code from the Web page into the new HTML file in Expression. Save the file in the root folder of the WordPress installation files, calling it "test" or a similar name. Within the first lines of the code, find the CSS call. This is the part of the code that refers to the CSS file currently on the Wordpress server. The code will contain directions to the WordPress server where the theme code is stored. Delete the website address and change the code so that the file destination is the theme file on your hard drive, such as href="wp-content/themes/[name of you chosen theme]." Changing the source of the theme code to the theme file on your hard drive means any changes you make to the code using Microsoft Expression will show up on your Wordpress website.
Save the page once you have changed the CSS call and change the view in Microsoft Expression to split view so you can see both the site and the code. You can now use the Microsoft Expression tools to modify the appearance of your site and check changes you have made using the test HTML page in the root folder.
- Always remember to save your Microsoft Expression file after making any code changes.