Build Your Own Business Website header image

Welcome to our Members Only Forum

You are welcome to view the content on our Forum, just scroll down to view this forum post.
If you like what you find and want to be able to post a question, please check out our subscription options.
Please feel free to search the forum using either the Google Site Search above or the forum search below.

Avatar
Search

— Forum Scope —




— Match —





— Forum Options —





Minimum search word length is 3 characters - maximum search word length is 84 characters

sp_Feed sp_TopicIcon
Using Image Maps
Avatar
Heidi Mueller

Founding Member
Members
Forum Posts: 136
Member Since:
August 8, 2010
sp_UserOfflineSmall Offline
1
May 25, 2011 - 4:35 pm
sp_Permalink sp_Print

Is it difficult to use an image map on a WordPress/Thesis page? I need to put a map of Canada on the page, and then have each province be clickable to either another page or to a target lower down on the same page.

Thanks

Heidi

Avatar
Rick Anderson
Desert Hot Springs, CA
Admin
Forum Posts: 13628
Member Since:
November 8, 2009
sp_UserOfflineSmall Offline
2
May 25, 2011 - 6:09 pm
sp_Permalink sp_Print

I would probably do the image map as a separate function and add it to the hook before content.  That way the image map html doesn't get mangled by the WordPress text editor.  And if the map was supposed to be in the middle of the text then I would use a short code to insert it.

It sounds like an interesting problem to resolve and I'd love to help you do that in a video.

Avatar
Heidi Mueller

Founding Member
Members
Forum Posts: 136
Member Since:
August 8, 2010
sp_UserOfflineSmall Offline
3
May 25, 2011 - 7:27 pm
sp_Permalink sp_Print

Would I create the image map in Dreamweaver, then copy the html and build that in the function? Presumably I would have to upload the image first so that I would have the url for it. <sigh> I had hoped there would be a plugin...

Avatar
Rick Anderson
Desert Hot Springs, CA
Admin
Forum Posts: 13628
Member Since:
November 8, 2009
sp_UserOfflineSmall Offline
4
May 26, 2011 - 8:37 am
sp_Permalink sp_Print

There might be a plugin.  

I haven't created an image map for years, however I would use a CS5 tool to create the image map and then place that html in a function.  In this case I'd add the image to thesis_18/custom/images.

Avatar
Brian Tozer

Founding Member
Members

Community Member
Forum Posts: 1004
Member Since:
May 30, 2010
sp_UserOfflineSmall Offline
5
May 26, 2011 - 9:11 am
sp_Permalink sp_Print

I agree that this would be a most instructive exercise and hope that it becomes a case study.

I assume that you were referring to Dreamweaver CS5, and although I have it many others may not.

I am hoping that this will not preclude the project from being implemented.

Avatar
Pam Cadd
Richland, WA
Jedi
Members
Forum Posts: 99
Member Since:
January 24, 2011
sp_UserOfflineSmall Offline
6
May 26, 2011 - 12:59 pm
sp_Permalink sp_Print

Here's another vote for a Live Answers demo - it would be very interesting and instructive. I hope it wouldn't require Dreamweaver, though.

Avatar
Rick Anderson
Desert Hot Springs, CA
Admin
Forum Posts: 13628
Member Since:
November 8, 2009
sp_UserOfflineSmall Offline
7
May 26, 2011 - 5:04 pm
sp_Permalink sp_Print

Unfortunately I don't feel qualified to give a tutorial in creating an image map in CS5 (which is what I use).  However, with the assumption that you'll use other sources for HOW to create the image map, I'm happy to take the project from WHAT to do with an image map.  In particular, how to implement and integrate the HTML.

Avatar
Brian Tozer

Founding Member
Members

Community Member
Forum Posts: 1004
Member Since:
May 30, 2010
sp_UserOfflineSmall Offline
8
May 26, 2011 - 6:32 pm
sp_Permalink sp_Print sp_EditHistory

There are many good tutorials for creating an Image Map in Dreamweaver CS5.

Google with "create image map" "dreamweaver cs5"

A good example is http://www.create-a-great-webs.....p-cs5.html

Avatar
Heidi Mueller

Founding Member
Members
Forum Posts: 136
Member Since:
August 8, 2010
sp_UserOfflineSmall Offline
9
May 27, 2011 - 8:24 am
sp_Permalink sp_Print

Hi again

I created the image map and simply pasted the code into the HTML view and to my surprise the editor did not mess it up and it works. http://wgicanada.org/?page_id=366

Only the top two links are activated.

Heidi

Avatar
Rick Anderson
Desert Hot Springs, CA
Admin
Forum Posts: 13628
Member Since:
November 8, 2009
sp_UserOfflineSmall Offline
10
May 27, 2011 - 8:40 am
sp_Permalink sp_Print

Just for grins, make sure you saved a copy of that html and then switch to the visual view and back to the html view and see what happens.

Avatar
Heidi Mueller

Founding Member
Members
Forum Posts: 136
Member Since:
August 8, 2010
sp_UserOfflineSmall Offline
11
May 27, 2011 - 1:35 pm
sp_Permalink sp_Print

Still works!

Heidi

Avatar
Rick Anderson
Desert Hot Springs, CA
Admin
Forum Posts: 13628
Member Since:
November 8, 2009
sp_UserOfflineSmall Offline
12
May 27, 2011 - 2:22 pm
sp_Permalink sp_Print

Great, then the whole image map thing is a breeze.

Forum Timezone: America/Los_Angeles

Most Users Ever Online: 228

Currently Online:
26 Guest(s)

Currently Browsing this Page:
1 Guest(s)

Top Posters:

Keith W Jones: 1422

Brian Tozer: 1004

Carolin: 982

Heidi Hafner: 492

John Cunningham: 423

Reece Morrel: 353

Newest Members:

emma80233

Tijs de Jong

Daniel Frey

mutek

emma9349

Vincent Racaniello

Forum Stats:

Groups: 8

Forums: 46

Topics: 6984

Posts: 34741

 

Member Stats:

Guest Posters: 6

Members: 6760

Moderators: 2

Admins: 2

Administrators: Rick Anderson, Rick Anderson

Moderators: Pierre Cote, Laura Nugent