I have my nice “About Us” page contained in a colorbox now. And the link that leads to it is embedded in a text area of a View’s header. But what I really want is to have a fancy about us button image that links to the colorbox.
I have the image link module installed but that just allows for a regular hyperlink. The way that I load colorbox in this case is via “colorbox-load” within the tags of the link itself. So, I simply added a piece of content that allows for full html (and isn’t available for anyone
else to author), uploaded my button to the custom images folder that I have within /sites and it works really well. Here is the way the link looks in the body of the html body field for the piece of content that i added. after the content is in place, i simply add it to the page via Panels, referencing it by the name of the node.
this is what the html looks like in the editor of the piece of content.
<p>
<a class=”colorbox-load” href=”content/media/about-docresourceorg?width=550&height=600&iframe=true”><img src=”sites/images/buttons/About1.png” /></a></p>
The images above show the end result. I still need to move the button around with a bit of CSS but that will be pretty straightforward.
Here are the highlights of making this work:
- Image uploaded manually, not a part of a piece of content
- Hyperlink embedded in the body field of a Full HTML Drupal piece of content
- That content piece added to a Panel Page
landie.tech 