Presentation on using WordPress with Dreamweaver CS5.x on a local system

1. Designing on a Local System

6. Lynda.com has step-by-step tutorials for installing MAMP/WAMP and WordPress locally.

12. After installing WordPress, install any themes you want to use.

13. This Genesis theme (Church) allows for different color themes.

16. Use Live View to see the page design in Dreamweaver.

17. Clicking on areas of the page, changes the display of div and class settings for that section. By clicking on a “div”, the properties defined in the css are shown.

18. I want to eliminate the background image in the body and change it’s color. I can “comment out” the image, and add a new property.

19. To add a background color that is consistent with the rest of the page, I can hover the mouse over and area (eyedropper not visible in screenshot) and Dreamweaver will fill in the hex code.

20. I’ve settled on the background color for the wrapper.

21. To view my changes live, I simply go to the browser.

22. I’m going to change the header in Dreamweaver. In this case I will edit by clicking the edit button (pencil).

24. Now I need to adjust the padding on the title area so the text and logo don’t overlap.

26. Letting Dreamweaver “Discover” dynamically related files, let’s you find linked php files such as footer.php easily.

27. WordPress sites have LOT of dynamically related files. Filtering allows you to display only those of interest.

29. There are three footer files. The last is the Genesis framework and should not be edited. This one defines the layout of the footer and calls the shortcodes.

30. This footer.php defines the shortcodes themselves. You now have the option to edit and customize the footer.* *This is being shown to illustrate the power of Dreamweaver CS5. However, for Genesis themes, using the Genisis Simple Edits plug-in is a simpler way.

46. Setting MySQL password

47. MySQL version will vary depending on when you downloaded.

52. You will need a text editor to edit config.inc to include the password.

55. After setting the MySQL password, restart all services.