This video is going to show you how to add Map Design<\/a> image maps to Rapidweaver<\/a> web sites. First, you are going to export your image map, and then choose the Effects based image map, and then choose a location to save the files to. You can see here in the finder where my files are. Now I will switch over to Rapidweaver, and the first thing I\u2019m going to do is add a new webpage. When I do this, I want to make sure I select the HTML Code web page, and then I\u2019ll hit the Add button.<\/p>\n

Next, open up the Inspector window. Click on the Assets tab if it\u2019s not currently highlited in blue, and now drag and drop all of the images that you just saved into the Assets listbox. So now all images have been imported, and we\u2019ll now go back to the index.html page. The first thing we\u2019ll want to do is fix the file path. Right now the folder is pointing to images, but Rapidweaver uses the assets folder, so we\u2019ll want to replace all of the code pointing to the images folder. To do this, highlight the text, and then press command F, and in the Find field, type in images, and in the Replace with field, type in assets. Then, click the Replace All button.<\/p>\n

Now we\u2019ll just copy all of the CSS code in this document, which is all the code within the Style tags. The first one is closer to the top and then we\u2019ll scroll down until we find the ending Style tag. Then we\u2019ll copy all of this highlighted code.<\/p>\n

Now we\u2019ll go back to the Inspector window, and\u00a0 we\u2019ll locate the CSS tab, and then paste what we just copied into the Custom CSS field box. We\u2019re done with the page inspector so we can close that window.<\/p>\n

Now we\u2019ll copy just the HTML code in that previous html document, which is just the little snippet right here, and simply paste it into this Rapidweaver HTML field, and now we\u2019re done. You can preview your image map in Rapidweaver by just clicking this preview tab here.<\/p>\n","protected":false},"excerpt":{"rendered":"

This video is going to show you how to add Map Design image maps to Rapidweaver web sites. First, you are going to export your image map, and then choose the Effects based image map, and then choose a location to save the files to. You can see here in …<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[4,10],"tags":[28,27,13],"_links":{"self":[{"href":"https:\/\/apptorial.com\/wp-json\/wp\/v2\/posts\/78"}],"collection":[{"href":"https:\/\/apptorial.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/apptorial.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/apptorial.com\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/apptorial.com\/wp-json\/wp\/v2\/comments?post=78"}],"version-history":[{"count":4,"href":"https:\/\/apptorial.com\/wp-json\/wp\/v2\/posts\/78\/revisions"}],"predecessor-version":[{"id":131,"href":"https:\/\/apptorial.com\/wp-json\/wp\/v2\/posts\/78\/revisions\/131"}],"wp:attachment":[{"href":"https:\/\/apptorial.com\/wp-json\/wp\/v2\/media?parent=78"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/apptorial.com\/wp-json\/wp\/v2\/categories?post=78"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/apptorial.com\/wp-json\/wp\/v2\/tags?post=78"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}