Javascript

Tuesday, January 14, 2014

Add these two lines somewhere in the head section of each page of your web site on which you'd like to pop a capsule in a lightbox:

<script src="http://test.42andpark.com/js/capzul.js" type="text/javascript"></script>
<link href="http://test.42andpark.com/css/capzul.css" rel="stylesheet" type="text/css"></link>

Here is a demo of what this provides:

Click Here!


Monday, January 13, 2014

Here's an embed code for a "spa rail":
 
The embed code used here is:

<iframe frameborder="0" height="400px" seamless="seamless" src="http://test.42andpark.com/capsule.jsp?contentId=cv2641&templateId=694&clearCache=false" width="100%"></iframe>

Saturday, July 27, 2013

If you view this blog while signed in, you'll have an extra button

If you have an account at 42&Park, and you are currently signed in, then you will have an upgraded experience while you view this blog.  The reason for that is that our code detects that you are signed in, and adds additional functionality.  You will see the "Add to collection" icon, which currently looks like a red heart icon.  This allows you to curate across the web, wherever you see a 42&Park capsule.

Friday, July 26, 2013

Popping a capsule

You can pop a capsule from any link or image on your web site, rather than embed it.  This offers some advantages over embedding:

  1. You can use whatever screen real estate you like.  Often a wider space than a typical web column (of about 550-600px) will offer a better user experience.
  2. Provide a different look and feel - the background is dimmed out while the capsule is popped
  3. Separate clearly between editorial and advertising
To try out popping a capsule, click the link below.

Click Here!

This works by calling a JavaScript function to pop a capsule.  To get this working, you will need to do two things:

  1. Add custom JavaScript to your web site
  2. Add custom styles to your web site controlling the popup window
The custom JavaScript and styles are available from 42&Park upon request.  (However, the industrious can retrieve those resources from this sample if you are so inclined!)