• I am working on an old site that I have not touched in some time. It uses custom fields (magic fields 2) to grab images for posts. So i upload an image to the “port_thumb” field in a post and it becomes the thumbnail for my gallery. I am trying to get a fancybox to work so that once a thumbnail is selected a larger image will display on that page. Right now the larger image opens on a page all by itself. I am very confused on how to code this using PHP and custom fields.

    This is the code for my thumbnails and fancybox. The thumbs load up correctly on the page with each post but the fancybox is not working.
    ——————————————–
    portfolio.php

    ———————————-
    This is the code in the header.

    <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”&gt;
    <html xmlns=”http://www.w3.org/1999/xhtml”&gt;
    <head>
    <link rel=”shortcut icon” href=”<?php bloginfo(‘template_directory’); ?>/images/favicon.ico” />
    <meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″ />
    <meta name=”viewport” content=”width=device-width; initial-scale=1.0; maximum-scale=1.0;”>
    <!–<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″ />–>
    <title><?php bloginfo(‘name’); ?> <?php if ( is_single() ) { ?> » Blog Archive <?php } ?> <?php wp_title(); ?></title>
    <link href=”<?php bloginfo(‘stylesheet_url’); ?>” rel=”stylesheet” type=”text/css” />
    <link href=’http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300&subset=latin,cyrillic-ext&#8217; rel=’stylesheet’ type=’text/css’>
    <link href=’http://fonts.googleapis.com/css?family=Iceland&#8217; rel=’stylesheet’ type=’text/css’>

    <script language=”javascript” type=”text/javascript”></script>

    <script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js”></script&gt;

    <script type=”text/javascript” src=”/fancybox/jquery.fancybox.pack.js”></script>
    <script type=”text/javascript” src=”/fancybox/jquery.easing-1.4.pack.js”></script>
    <script type=”text/javascript” src=”/fancybox/jquery.mousewheel-3.0.4.pack.js”></script>

    <link rel=”stylesheet” href=”/fancybox/source/jquery.fancybox.css” type=”text/css” media=”screen” />

    </head>

    ——————————————–

    Does the code for portfolio.php look correct?

The topic ‘Fancybox with custom fields’ is closed to new replies.