Pass the value in a field into a colorbox popup

Question

Is it possible to dynamically change a link on a colorbox popup a specific field value?

I have a view displaying a list of external links that have been added using a custom content type. And what I would like to do is be able to have a colorbox popup when you click on one of those links that explains that you are about to go to an external site.

I have the colorbox popup working with a button to go to that link, but I need the link of the colorbox button to change depending on which node they click on in the view.

My field is "field_conf_presentation_link"

Can I pass that value in anyway to the link that the popup would have?

Here is my view displaying the link they would click on:

Here is the code I have on my page template file that creates the content for the popup:

<div style="display:none;">
<div id="gate">
  <?php print '<p>' . t('You are now being redirected to view this live session.') . '</p>'; ?>
  <?php print l('Watch Now ›', '**LINK HERE**', array('attributes' => array('class' => array('btn-small')) ) ); ?>
</div>

I've been looking around and see that there is a module called Colorbox Node that might be able to give me what I want, but I am hoping I can get around that for something like this.

Answer 1

Using the Drupal Colorbox module you should be able to accomplish this.

You just need to add the class colorbox-load to your link and then to modify the colorbox settings per link append something like ?width=500&height=500 to the end of the path.

Colorbox Documentation

Check the "Enable Colorbox load" option in Colorbox settings.

This enables custom links that can open content in a Colorbox. Add the class "colorbox-load" to the link and build the url like this "[path]?width=500&height=500&iframe=true" or "[path]?width=500&height=500" if you don't want an iframe.

If you want to pass the width and height of the Colorbox as a percentage (useful for responsive designs), you can format the link like this "[path]?width=90%25&height=90%25&iframe=true" or "[path]?width=90%25&height=90%25", where the "%25" is the HTML entity for "%".

Other modules may activate this for easy Colorbox integration.

Load inline content in a Colorbox

Check the "Enable Colorbox inline" option in Colorbox settings.

This enables custom links that can open inline content in a Colorbox. Inline in this context means some part/tag of the current page, e.g. a div. Replace "id-of-content" with the id of the tag you want to open.

Add the class "colorbox-inline" to the link and build the url like this "?width=500&height=500&inline=true#id-of-content".

It could e.g. look like this.

Link to click What ever content you want to display in a Colorbox. Alternatively instead of style="display: none;" you could use class="element-hidden".

Other modules may activate this for easy Colorbox integration.

Answer 2

With the help of @Citricguy I was able to find a solution to this. Turns out the feature needed is not the load, but the inline feature.

It's not the cleanest solution but using views I was able to create a custom text field that created a DIV using tokens. I then passed that DIV into the colorbox-inline. With that I was able to generate the dynamic link in my colorbox that I needed.