Menu icon Foundation

Designer | Melbourne, Australia

MickCreates http://mickcreates.com/

My Posts

My Comments

Mick commented on Rafi Benkual's post almost 6 years

I'm surprised this doesn't have more of a response, I too would like to know if this is possible.
I would prefer to use Clearing Lightbox rather than loading another plugin purely for loading social media icons.

Edit:

Here's the best I could come up with using the example of a Pinterest button on each slide:

<ul class="example-orbit" data-orbit>
  <li>
    <img data-caption="<a href='//www.pinterest.com/pin/create/button/' data-pin-do='buttonBookmark'  data-pin-color='white'><img src='//assets.pinterest.com/images/pidgets/pinit_fg_en_rect_white_20.png' /></a>" src="http://placehold.it/1000x300/A92B48/fff" alt="slide 1" />
    <div class="orbit-caption">
      Caption One.
    </div>
  </li>
  <li>
    <img data-caption="<a href='//www.pinterest.com/pin/create/button/' data-pin-do='buttonBookmark'  data-pin-color='white'><img src='//assets.pinterest.com/images/pidgets/pinit_fg_en_rect_white_20.png' /></a>" src="http://placehold.it/1000x300/EE964D/fff" alt="slide 2" />
    <div class="orbit-caption">
      Caption Two.
    </div>
  </li>
  <li>
    <img data-caption="<a href='//www.pinterest.com/pin/create/button/' data-pin-do='buttonBookmark'  data-pin-color='white'><img src='//assets.pinterest.com/images/pidgets/pinit_fg_en_rect_white_20.png' /></a>" src="http://placehold.it/1000x300/FDC43D/fff" alt="slide 3" />
    <div class="orbit-caption">
      Caption Three.
    </div>
  </li>
</ul>

You can add the social media sharing code to the data-caption="" element as long as you only use single and not double quotation marks.

An easier way of doing this is if you're using wordpress, to simply drop a shortcode in to the data-caption that calls your social media buttons.

Helpful 0

Posts Followed

Following

    No Content

Followers

My Posts

My Comments

You commented on Rafi Benkual's post almost 6 years

I'm surprised this doesn't have more of a response, I too would like to know if this is possible.
I would prefer to use Clearing Lightbox rather than loading another plugin purely for loading social media icons.

Edit:

Here's the best I could come up with using the example of a Pinterest button on each slide:

<ul class="example-orbit" data-orbit>
  <li>
    <img data-caption="<a href='//www.pinterest.com/pin/create/button/' data-pin-do='buttonBookmark'  data-pin-color='white'><img src='//assets.pinterest.com/images/pidgets/pinit_fg_en_rect_white_20.png' /></a>" src="http://placehold.it/1000x300/A92B48/fff" alt="slide 1" />
    <div class="orbit-caption">
      Caption One.
    </div>
  </li>
  <li>
    <img data-caption="<a href='//www.pinterest.com/pin/create/button/' data-pin-do='buttonBookmark'  data-pin-color='white'><img src='//assets.pinterest.com/images/pidgets/pinit_fg_en_rect_white_20.png' /></a>" src="http://placehold.it/1000x300/EE964D/fff" alt="slide 2" />
    <div class="orbit-caption">
      Caption Two.
    </div>
  </li>
  <li>
    <img data-caption="<a href='//www.pinterest.com/pin/create/button/' data-pin-do='buttonBookmark'  data-pin-color='white'><img src='//assets.pinterest.com/images/pidgets/pinit_fg_en_rect_white_20.png' /></a>" src="http://placehold.it/1000x300/FDC43D/fff" alt="slide 3" />
    <div class="orbit-caption">
      Caption Three.
    </div>
  </li>
</ul>

You can add the social media sharing code to the data-caption="" element as long as you only use single and not double quotation marks.

An easier way of doing this is if you're using wordpress, to simply drop a shortcode in to the data-caption that calls your social media buttons.

Helpful 0

Posts Followed

Following

  • No Content

Followers

  • No Content

Register Today

Get all the answers in our
Foundation Classes

Learn Foundation from the creators in our interactive online webinars which will keep you up to date with the latest trends and skills needed to win your projects.

See Upcomming Classes

Or if you prefer, contact the Foundation Team at [email protected] or (408) 341-0600 x635