![]() ![]() ![]() Images are a common element in webpages, and so being able to insert and use them effectively is key to creating a site that is able to maximize ease of access to your site while still providing relevant visuals.Īdding images to your page in BlueGriffon is a simple process, as we saw in the first section on the Home Page.TCP/IP, represented by the cloud in Figure 1, handles the details. For the sake of convenience, we will briefly cover once again how to insert them into a page and refresh updated images, before moving on to the more complex task of making existing text wrap around an image.īefore adding an image, you will want to move it to the files folder in your main site directory. To move the image or images to your files folder, first navigate to it. Then, open a new explorer window, and navigate to the location of the image(s). To add an image, first click on the Insert or edit an image in the main toolbar ( Fig.Īfter selecting the image(s), click and drag to the window and release the mouse button ( Fig. Then select the image you want to insert, and click Open ( Fig. Insert a title and an alternate text for the image, and click OK ( Fig. The title will be what appears when you move the mouse over the image, and the alternate text is what is read in assistive technology programs. Generally, the alt text describes the contents of the image, for those who have images disabled on their browser, or who are using a screen reader. Once the window disappears, your image should be successfully inserted into your page, at the location of the cursor. It may happen that when you go back and edit an image that appears in your site, BlueGriffon will still display the older version of the image. In this case, you can manually refresh the image. Earlier versions of the program were more apt to have this problem, although it is possible that such a thing could happen in the newer version as well, depending on the circumstances.įirst, click on the image you want to manually refresh ( Fig. With the image selected, click on the Insert or edit an image button in the main toolbar ( Fig. 7-6).Ĭlick the check box beside Make URL relative to page location, which will allow the program to refresh the image, and click OK (if you do not have Alternate text specified for you image, you will have to also click the check box Allow an empty alternate text in order to be able to apply the changes ( Fig. After clicking OK, the image will be refreshed on your page to reflect the most recent changes made. In order for your images to not clutter the page, it is neccessary to make the existing text wrap around in in such a way that it is still readable. ![]() To do this, you will need to have recourse to the Source view of BlueGriffon, and make use of some HTML coding. More on the Source view will be said later. To begin, first place the cursor directly to the right of the image. The cursor's position will act as a placeholder, allowing you to successfully locate the image within the HTML code ( Fig. Then, click on the Source tab at the bottom of the screen to switch to the Source view ( Fig. When in Source view, be careful to follow these instructions exactly. If you return to the Wysiwyg view, and the HTML is not properly coded (errors in the code will be indicated by BlueGriffon changing all the code within a particular paragraph to a red color), it will result in your page being irretrievably corrupted.Īfter switching to the Source view, the line of HTML containing the image should be highlighted ( Fig. Place the cursor in between the last quotation mark (") and the carat (>). Once the cursor was placed, spress the Space bar, and type align, then enter the = key. ![]()
0 Comments
Leave a Reply. |