Google Fonts for Dreamweaver CS6
Transcript of Google Fonts for Dreamweaver CS6
![Page 1: Google Fonts for Dreamweaver CS6](https://reader031.fdocuments.us/reader031/viewer/2022020110/55a4e9441a28aba85c8b45f7/html5/thumbnails/1.jpg)
Here you will learn the steps to add Google font to one tag on your Dreamweaver CS6 page
![Page 2: Google Fonts for Dreamweaver CS6](https://reader031.fdocuments.us/reader031/viewer/2022020110/55a4e9441a28aba85c8b45f7/html5/thumbnails/2.jpg)
Create a new Dreamweaver page using 2 column fixed, left sidebar, header and footer
![Page 3: Google Fonts for Dreamweaver CS6](https://reader031.fdocuments.us/reader031/viewer/2022020110/55a4e9441a28aba85c8b45f7/html5/thumbnails/3.jpg)
Select the heading on the page. h1
![Page 4: Google Fonts for Dreamweaver CS6](https://reader031.fdocuments.us/reader031/viewer/2022020110/55a4e9441a28aba85c8b45f7/html5/thumbnails/4.jpg)
Go to www.google.com/webfonts
![Page 5: Google Fonts for Dreamweaver CS6](https://reader031.fdocuments.us/reader031/viewer/2022020110/55a4e9441a28aba85c8b45f7/html5/thumbnails/5.jpg)
Find a font you like and select Quick-use. Here you will see how long it takes to load and the code to be added to your web page.
![Page 6: Google Fonts for Dreamweaver CS6](https://reader031.fdocuments.us/reader031/viewer/2022020110/55a4e9441a28aba85c8b45f7/html5/thumbnails/6.jpg)
Open Dreamweaver html page to code view. Insert font code after <head>
![Page 7: Google Fonts for Dreamweaver CS6](https://reader031.fdocuments.us/reader031/viewer/2022020110/55a4e9441a28aba85c8b45f7/html5/thumbnails/7.jpg)
Select the heading on the page. <h1>
![Page 8: Google Fonts for Dreamweaver CS6](https://reader031.fdocuments.us/reader031/viewer/2022020110/55a4e9441a28aba85c8b45f7/html5/thumbnails/8.jpg)
Go to Properties panel choose Edit Rule> New Rule>
<New CSS Rule>
![Page 9: Google Fonts for Dreamweaver CS6](https://reader031.fdocuments.us/reader031/viewer/2022020110/55a4e9441a28aba85c8b45f7/html5/thumbnails/9.jpg)
New Selector Type> Choose Tag for all <h1> tags. Then click OK.
![Page 10: Google Fonts for Dreamweaver CS6](https://reader031.fdocuments.us/reader031/viewer/2022020110/55a4e9441a28aba85c8b45f7/html5/thumbnails/10.jpg)
Select font name and add to Font-family in Type panel with out any ‘’.
![Page 11: Google Fonts for Dreamweaver CS6](https://reader031.fdocuments.us/reader031/viewer/2022020110/55a4e9441a28aba85c8b45f7/html5/thumbnails/11.jpg)
Check to see if the h1 tag is your font. The new font fill not be seen until on viewed Live.
![Page 12: Google Fonts for Dreamweaver CS6](https://reader031.fdocuments.us/reader031/viewer/2022020110/55a4e9441a28aba85c8b45f7/html5/thumbnails/12.jpg)
Live view will show the font for <h1>. Also you can use a Class tag and add font family.