conditional sidebar for certain post id Wordpress PHP - php

I'm new to PHP and and using a Wordpress one-page theme where each section has a unique post ID. I want to add a sidebar only to a post with a specific ID. The code for that specific ID should add a few divs for styling as well as the sidebar. I've tried adding a simple if/else statement and putting the code with the extra divs and sidebar in the if, and the original code without the sidebar or extra styling in the else but my code results not only styling for the widget on each post, but also removes the other content from the post I'm targeting. This is the entire php file for the template. Any help is much appreciated!
<?php
/*
Template Name: Onepage
*/
?>
<?php global $smof_data; ?>
<?php get_header();?>
<?php
if ( ( $locations = get_nav_menu_locations() ) && $locations['primary'] && !disable_onepage() ) {
$menu = wp_get_nav_menu_object( $locations['primary'] );
$menu_items = wp_get_nav_menu_items($menu->term_id);
$pages_included = array();
foreach ( $menu_items as $item ):
if ($item->object != 'page') continue;
$menu_state = get_post_meta($item->ID,'menu-item-menu-state',true);
if ($menu_state == 'link') continue;
$pages_included[] = $item->object_id;
endforeach;
} else {
$pages_included[] = array();
}
$count = 0;
/* IF THERE IS AT LEAST ONE PAGE MENU ITEM */
if (!empty($pages_included)) :
$args = array(
'post_type' => 'page',
'post__in' => $pages_included,
'posts_per_page' => count($pages_included),
'orderby' => 'post__in',
);
$onepage_query = new WP_Query();
$onepage_query->query($args);
endif;
if ( $onepage_query->have_posts() ): while( $onepage_query->have_posts() ): $onepage_query->the_post(); $count++;?>
<?php // Some PHP stuffs
$page_template = get_post_meta(get_the_ID(),'_wp_page_template',true);
$page_template = basename($page_template,'.php');
/* ----------------------------- GET OPTIONS ----------------------------------- */
/* Title Options
----------------------------------------------- */
$subtitle = get_post_meta(get_the_ID(),'_wi_subtitle',true);
$subtitle = trim($subtitle);
$title_image = false;
$title_image_ids = get_post_meta(get_the_ID(),'_wi_title-image',false);
$title_image_id = '';
foreach ( $title_image_ids as $tii ) {
if ( !wp_get_attachment_image_src( $tii ) ) continue;
$title_image_id = $tii;
}
if ( $title_image_id ) {
$title_image = wp_get_attachment_image_src($title_image_id,'full');
$title_image = $title_image[0];
}
$hide_title = get_post_meta(get_the_ID(),'_wi_hide-title-area',true);
/* Page Background Options
----------------------------------------------- */
$page_background_type = get_post_meta(get_the_ID(),'_wi_page-background-type',true);
$page_background_color = get_post_meta(get_the_ID(),'_wi_page-background-color',true);
$page_background_image = get_post_meta(get_the_ID(),'_wi_page-background-image',true);
$page_background_image_size = get_post_meta(get_the_ID(),'_wi_page-background-image-size',true);
$page_background_image_position = get_post_meta(get_the_ID(),'_wi_page-background-image-position',true);
$page_background_pattern = get_post_meta(get_the_ID(),'_wi_page-background-pattern',true);
$page_background_pattern_retina = get_post_meta(get_the_ID(),'_wi_page-background-pattern-retina',true);
/* Separator Background Options
----------------------------------------------- */
$disable_separator = get_post_meta(get_the_ID(),'_wi_disable-page-separator',true);
$separator_content = get_post_meta(get_the_ID(),'_wi_separator-content',true);
$background_or_pattern = get_post_meta(get_the_ID(),'_wi_background-image-or-pattern',true);
if ( $background_or_pattern!='pattern' ) $background_or_pattern = 'background';
$background_images = get_post_meta(get_the_ID(),'_wi_background-image',false);
$background_image = '';
foreach ( $background_images as $bgim ) {
if ( !wp_get_attachment_image_src( $bgim) ) continue;
$background_image = $bgim;
}
$overlay_opacity = get_post_meta(get_the_ID(),'_wi_overlay-opacity',true);
$overlay_opacity = absint($overlay_opacity);
$clipmask_opacity = get_post_meta(get_the_ID(),'_wi_clipmask-opacity',true);
$clipmask_opacity = absint($clipmask_opacity);
$enable_parallax = get_post_meta(get_the_ID(),'_wi_enable-parallax-effect',true);
$parallax_class = ( $enable_parallax ) ? ' parallax' : '';
$padding = get_post_meta(get_the_ID(),'_wi_padding-top-bottom',true);
$predefined_pattern = get_post_meta(get_the_ID(),'_wi_predefined-pattern',true);
$retina_custom_patterns = get_post_meta(get_the_ID(),'_wi_retina-custom-pattern',false);
$retina_custom_pattern = '';
foreach ($retina_custom_patterns as $bgim ) {
if ( !wp_get_attachment_image_src( $bgim) ) continue;
$retina_custom_pattern = $bgim;
}
$custom_patterns = get_post_meta(get_the_ID(),'_wi_custom-pattern',false);
$custom_pattern = '';
foreach ( $custom_patterns as $bgim ) {
if ( !wp_get_attachment_image_src( $bgim) ) continue;
$custom_pattern = $bgim;
}
if ( $background_or_pattern != 'pattern' ) {
$background_type = 'image';
if ( $background_image ) {
$background_image = wp_get_attachment_image_src($background_image,'full');
$background_image = $background_image[0];
$background_size = 'cover';
} else {
$background_image = '';
$background_size = '';
}
$retina_background_image = $background_image;
} else { // $background_or_pattern == 'pattern'
$background_type = 'pattern';
if ( $custom_pattern ) {
$pattern = $custom_pattern;
if ( $retina_custom_pattern ) {
$retina_pattern = $retina_custom_pattern;
} else {
$retina_pattern = $custom_pattern;
}
$pattern = wp_get_attachment_image_src($pattern,'full');
$pattern = $pattern[0];
$retina_pattern = wp_get_attachment_image_src($retina_pattern,'full');
$retina_pattern = $retina_pattern[0];
} else {
$pattern = $predefined_pattern;
$retina_pattern = str_replace( '.png' , '_#2X.png' , $pattern );
}
if ( !$pattern ) $pattern = get_template_directory_uri().'/images/sidrbg/argyle.png';
if ( $pattern ) {
$background_image = $pattern;
$background_size = (array) #getimagesize($pattern);
if ( isset($background_size[0]) && isset($background_size[1]) ) {
$background_size = $background_size[0] . 'px ' . $background_size[1] . 'px';
} else {
$background_size = 'auto';
}
} else {
$background_image = '';
$background_size = '';
}
if ( $retina_pattern ) {
$retina_background_image = $retina_pattern;
} else {
$retina_background_image = $pattern;
}
} // image or pattern
?>
<?php if ( !$disable_separator ) :?>
<style type="text/css">
#page-separator-<?php echo esc_html($post->post_name);?> {
background-image:url(<?php echo esc_url($background_image);?>);
-webkit-background-size:<?php echo esc_html($background_size);?>;
-moz-background-size:<?php echo esc_html($background_size);?>;
background-size:<?php echo esc_html($background_size);?>;
padding-top:<?php echo absint($padding);?>px;
padding-bottom:<?php echo absint($padding);?>px;
}
#page-separator-<?php echo esc_html($post->post_name);?> .overlay {
opacity:<?php echo ($overlay_opacity/100);?>;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=<?php echo ($overlay_opacity);?>)";
filter: alpha(opacity=<?php echo ($overlay_opacity);?>);
}
#page-separator-<?php echo esc_html($post->post_name);?> .clipmask {
opacity:<?php echo ($clipmask_opacity/100);?>;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=<?php echo ($clipmask_opacity);?>)";
filter: alpha(opacity=<?php echo ($clipmask_opacity);?>);
}
#media (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi){
#page-separator-<?php echo esc_html($post->post_name);?> {
background-image:url(<?php echo esc_url($retina_background_image);?>);
}
}
</style>
<div class="<?php echo esc_attr('page-separator background-type-' . $background_type . $parallax_class);?>" id="<?php echo esc_attr('page-separator-' . $post->post_name);?>">
<div class="overlay"></div>
<div class="clipmask"></div>
<div class="container">
<div class="content">
<?php echo do_shortcode($separator_content); ?>
</div><!-- .content -->
</div><!-- .container -->
</div><!-- .page-separator #page-separator-$post->post_name -->
<?php endif; // enable/disable page separator ?>
<style type="text/css">
<?php if($page_background_color){?>
.wi-page#<?php echo esc_html($post->post_name);?> {
background-color:<?php echo sanitize_hex_color($page_background_color);?>;
}
<?php } ?>
/* --------- BACKGROUND PATTERN OPTIONS ------------ */
<?php if ($page_background_type == 'pattern'): ?>
<?php if($page_background_pattern){
$pattern = wp_get_attachment_image_src($page_background_pattern,'full');
$pattern = $pattern[0];
$background_size = (array) #getimagesize($pattern);
$background_size = $background_size[0] . 'px ' . $background_size[1] . 'px';
?>
.wi-page#<?php echo esc_html($post->post_name);?> {
background-image:url(<?php echo esc_url($pattern);?>);
-webkit-background-size:<?php echo esc_html($background_size);?>;
-moz-background-size:<?php echo esc_html($background_size);?>;
background-size:<?php echo esc_html($background_size);?>;
}
<?php } ?>
<?php if($page_background_pattern_retina){
$pattern = wp_get_attachment_image_src($page_background_pattern_retina,'full');
$pattern = $pattern[0];
?>
#media (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi){
.wi-page#<?php echo esc_html($post->post_name);?> {
background-image:url(<?php echo esc_url($pattern);?>);
}
}
<?php } ?>
/* --------- BACKGROUND IMAGE OPTIONS ------------ */
<?php elseif ($page_background_type == 'image'): ?>
<?php if($page_background_image){
$page_background_image = wp_get_attachment_image_src($page_background_image,'full');
$page_background_image = $page_background_image[0];
?>
.wi-page#<?php echo esc_html($post->post_name);?> {
background-image:url(<?php echo esc_url($page_background_image);?>);
-webkit-background-size:<?php echo esc_html($page_background_image_size);?>;
-moz-background-size:<?php echo esc_html($page_background_image_size);?>;
background-size:<?php echo esc_html($page_background_image_size);?>;
background-position:<?php echo esc_html($page_background_image_position);?>;
}
<?php } ?>
<?php endif; // page background type ?>
</style>
<?php
if ($post->ID == '4048') {
?>
<div <?php post_class('wi-page '.$page_template);?> id="<?php echo esc_attr($post->post_name);?>">
<?php if ( !$hide_title ){ ?>
<!-- TITLE -->
<div class="title-area">
<div class="container">
<div class="pad">
<?php if ( $title_image ) : ?>
<div class="image">
<img src="<?php echo esc_url($title_image);?>" alt="<?php the_title();?>" />
</div><!-- .image -->
<?php endif; // header_image ?>
<h2 class="title"><?php the_title();?></h2>
<?php if ($subtitle):?>
<h3 class="subtitle"><?php echo wp_kses($subtitle,''); ?></h3>
<?php endif;?>
</div><!-- .pad -->
</div><!-- .container -->
</div><!-- .title-area -->
<?php }
}else{ ?>
<div class="content-area">
<div class="container">
<div class="row-fluid"> <!-- added for styling -->
<div id="primary" class="span8"> <!-- added for styling -->
<?php the_content();?>
</div> <!-- added for styling #primary -->
<?php get_sidebar('video-sidebar');?>
</div><!-- .row-fluid -->
</div><!-- .container -->
<div class="clearfix"></div>
</div> <!-- content-area -->
</div><!-- .wi-page -->
<?php } ?>
<?php
endwhile; // have posts
endif; // have posts
if (!empty($pages_included)) :
wp_reset_query();
endif;
// in case onepage disabled but user wants to use onepage template for some usage
if ( disable_onepage() ):
if (have_posts()) :?>
<div class="container">
<?php while(have_posts()): the_post(); ?>
<article <?php post_class('article wi-single');?> id="post-<?php the_ID();?>">
<?php the_content();?>
<?php wp_link_pages( array( 'before' => '<div class="page-links-container"><div class="page-links"><div class="page-links-label">' . __( 'Pages:', 'wi' ) . '</div>', 'after' => '</div></div>', 'pagelink' => '<span>%</span>' ) ); ?>
</article><!-- .article -->
<?php endwhile;?>
</div><!-- .container -->
<?php endif;
endif; // if disable onepage
?>
<?php get_footer();?>

<?php
if ($post->ID == '4048') {
?>
<div <?php post_class('wi-page '.$page_template);?> id="<?php echo esc_attr($post->post_name);?>">
<?php if ( !$hide_title ){ ?>
<!-- TITLE -->
<div class="title-area">
<div class="container">
<div class="pad">
<?php if ( $title_image ) : ?>
<div class="image">
<img src="<?php echo esc_url($title_image);?>" alt="<?php the_title();?>" />
</div><!-- .image -->
<?php endif; // header_image ?>
<h2 class="title"><?php the_title();?></h2>
<?php if ($subtitle):?>
<h3 class="subtitle"><?php echo wp_kses($subtitle,''); ?></h3>
<?php endif;?>
</div><!-- .pad -->
</div><!-- .container -->
</div><!-- .title-area -->
<?php }
}else{ ?>
<div class="content-area">
<div class="container">
<div class="row-fluid"> <!-- added for styling -->
<div id="primary" class="span8"> <!-- added for styling -->
<?php the_content();?>
</div> <!-- added for styling #primary -->
<?php get_sidebar('video-sidebar');?>
</div><!-- .row-fluid -->
</div><!-- .container -->
<div class="clearfix"></div>
</div> <!-- content-area -->
</div><!-- .wi-page -->
<?php } ?>
You forgot to close in line number 3 ?>

Related

Change HTML for odd & even items in a foreach loop

My PHP isn't great!
I have some metaboxes in a wordpress website that displays a column type layout. I can output the metabox content as follows:
<?php
// Group ID
$columns_values = rwmb_meta( 'columns_solutions' );
if ( ! empty( $columns_values ) ) : ?>
<section class="columns">
<?php foreach ( $columns_values as $columns_value ) {
// Grab the image
$columns_imgs = isset( $columns_value['_rtl_column_solutions_image'] ) ? $columns_value['_rtl_column_solutions_image'] : array();
foreach ( $columns_imgs as $columns_img ) {
// Set each image size for the responsive background
$column_image_lg = RWMB_Image_Field::file_info( $columns_img, array( 'size' => 'column-lg' ) );
$column_image_md = RWMB_Image_Field::file_info( $columns_img, array( 'size' => 'column-md' ) );
$column_image_sm = RWMB_Image_Field::file_info( $columns_img, array( 'size' => 'column-sm' ) );
$column_image_xs = RWMB_Image_Field::file_info( $columns_img, array( 'size' => 'column-xs' ) );
}
// Grab the title, oversized text and general text
$column_title = isset( $columns_value['_rtl_columns_title'] ) ? $columns_value['_rtl_columns_title'] : array();
$column_oversized = isset( $columns_value['_rtl_columns_oversized'] ) ? $columns_value['_rtl_columns_oversized'] : array();
$column_general_txt = isset( $columns_value['_rtl_columns_general_text'] ) ? $columns_value['_rtl_columns_general_text'] : array();
?>
<div class="columns-wrapper">
<div class="column">
<?php if(!empty($column_title)) { ?>
<div class="section-title">
<h2>
<?php echo $column_title; ?>
</h2>
</div>
<!-- /.section-title -->
<?php } ?>
<?php if(!empty($column_oversized)) { ?>
<div class="oversized">
<?php echo $column_oversized; ?>
</div>
<!-- /.oversized -->
<?php } ?>
<?php if(!empty($column_general_txt)) { ?>
<?php echo wpautop($column_general_txt); ?>
<?php } ?>
</div>
<!-- /.column -->
<div class="column">
<div class="image min-height cover bg-responsive" style="background-image: url(<?php echo LAZY_IMG; ?>);"
data-lg="<?php echo $column_image_lg['url']; ?>"
data-md="<?php echo $column_image_md['url']; ?>"
data-sm="<?php echo $column_image_sm['url']; ?>"
data-xs="<?php echo $column_image_xs['url']; ?>">
</div>
<!-- /.image -->
</div>
<!-- /.column -->
</div>
<!-- /.column-wrapper -->
<?php } ?>
</section>
<!-- /.columns -->
<?php endif; ?>
Output as below:
This is a clonable meta group, I would like to be able to swap the content and the image (left & right) with each odd and even foreach loop/array.
I feel so stupid, all I needed was to count the posts and output alternate html.
I wrapped my code above in this:
<?php $counter = "";
foreach ( $columns_values as $columns_value ) {
$counter +=1;
// all my var stuff here
?>
<?php if($counter == 1) { ?>
<div class="columns-wrapper odd">
<!-- HTML here for the first loop -->
</div>
<?php }
// If the second item in the loop
elseif($counter == 2) {
// Reset the counter
$counter = 0;
?>
<div class="columns-wrapper even">
<!-- Other HTML here for the second loop -->
</div>
<?php } //end the elseif $counter ?>
<?php } //end the foreach stuff ?>

how to make banner image draggable inside div then save position

I've seen lots of questions and answers around how to do this but I am very stuck how I implement this into my webpage. I have a div named "banner" that contains an image drawn from a custom field that is on all my artist pages as a banner for each page. I would like to be able to drag this image inside the div and to save it's position. (I only want this function for myself, not visitors to the website) AKA Facebook page cover image.. This would allow me to add an image that is bigger than the div container to my custom field and for me to edit how this is showing inside the div.
This demonstates what I want to do- http://w3lessons.info/2014/08/31/facebook-style-cover-image-reposition-using-jquery-php/
but i don't understand where i put these codes in my wordpress files and how to make this work for me.. I only want this on my artist pages, and therefore using my single-artists.php template..
Here is my php code-
<?php
// artist download start
// if ( isset($_GET['download']) ) {
// header('Content-type: application/mp3');
// header('Content-Disposition: attachment; filename='.basename($_GET['download']));
// readfile( $_GET['download'] );
// }
// artist download end
get_header();
global $cs_transwitch,$prettyphoto_flag;
$prettyphoto_flag = "true";
$cs_artist = get_post_meta($post->ID, "cs_artist", true);
if ( $cs_artist <> "" ) {
$xmlObject = new SimpleXMLElement($cs_artist);
$cs_layout = $xmlObject->cs_layout;
$cs_sidebar_left = $xmlObject->cs_sidebar_left;
$cs_sidebar_right = $xmlObject->cs_sidebar_right;
}
if ( $cs_layout == "left" ) {
$cs_layout = "two-thirds column right";
$show_sidebar = $cs_sidebar_left;
}
else if ( $cs_layout == "right" ) {
$cs_layout = "two-thirds column left";
$show_sidebar = $cs_sidebar_right;
}
else $cs_layout = "sixteen columns left";
?>
<div id="banner">
<div id="bannercontent"><?php
list($src, $w, $h) = get_custom_field('banner:to_image_array');
?>
<img src="<?php print $src; ?>" width="100%" />
</div></div>
<script>$( "#bannercontent" ).draggable({
stop: function(){
alert('top offset: ' + $('#bannercontent').offset().top + ' left offset: ' + $('#bannercontent').offset().left);
}
});</script>
<div class="clear:both;"></div>
<div id="container" class="container row">
<div role="main" class="<?php echo $cs_layout;?>" >
<?php
/* Run the loop to output the post.
* If you want to overload this in a child theme then include a file
* called loop-single.php and that will be used instead.
*/
//get_template_part( 'loop', 'single_cs_artist' );
?>
<?php if ( have_posts() ): while ( have_posts() ) : the_post(); ?>
<?php
//showing meta start
$cs_artist = get_post_meta($post->ID, "cs_artist", true);
if ( $cs_artist <> "" ) {
$xmlObject = new SimpleXMLElement($cs_artist);
$cs_layout = $xmlObject->cs_layout;
$cs_sidebar_left = $xmlObject->cs_sidebar_left;
$cs_sidebar_right = $xmlObject->cs_sidebar_right;
$artist_release_date = $xmlObject->artist_release_date;
$artist_social_share = $xmlObject->artist_social_share;
$artist_buy_amazon = $xmlObject->artist_buy_amazon;
$artist_buy_apple = $xmlObject->artist_buy_apple;
$artist_buy_groov = $xmlObject->artist_buy_groov;
$artist_buy_cloud = $xmlObject->artist_buy_cloud;
}
//showing meta end
?>
<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<h1 class="heading"><?php the_title(); ?></h1>
<div class="in-sec">
<?php
// getting featured image start
$image_id = get_post_thumbnail_id ( $post->ID );
if ( $image_id <> "" ) {
//$image_url = wp_get_attachment_image_src($image_id, array(208,208),true);
$image_url = cs_attachment_image_src($image_id, 208, 208);
$image_url = $image_url;
//$image_url_full = wp_get_attachment_image_src($image_id, 'full',true);
$image_url_full = cs_attachment_image_src($image_id, 0, 0);
$image_url_full = $image_url_full;
}
else {
$image_url = get_template_directory_uri()."/images/admin/no_image.jpg";
$image_url_full = get_template_directory_uri()."/images/admin/no_image.jpg";
}
//$image_id = get_post_thumbnail_id ( $post->ID );
//$image_url = wp_get_attachment_image_src($image_id, array(208,198),true);
//$image_url_full = wp_get_attachment_image_src($image_id, 'full',true);
// getting featured image end
?>
<div class="light-box artist-tracks artist-detail <?php if($image_id == "") echo "no-img-found";?> ">
<div id="main-container">
<div id="leftcolumn">
<a rel="prettyPhoto" name="<?php the_title(); ?>" href="<?php echo $image_url_full?>" class="thumb" >
<?php echo "<img src='".$image_url."' />";?>
</a>
<br>
<br>
<div id="inpostgallery"><?php echo do_shortcode('[inpost_gallery thumb_width="104" thumb_height="104" post_id="' . get_the_ID() . '" thumb_margin_left="0" thumb_margin_bottom="0" thumb_border_radius="2" thumb_shadow="0 1px 4px rgba(0, 0, 0, 0.2)" js_play_delay="3000" id="" random="0" group="0" border="" type="yoxview" show_in_popup="0" artist_cover="" artist_cover_width="200" artist_cover_height="200" popup_width="800" popup_max_height="600" popup_title="Gallery"][/inpost_gallery]'); ?></div>
</div>
<div id="rightcolumn">
<div class="desc">
<p style="font-size:12px;"><span class="bold" style="text-transform:uppercase; color:#262626;"><?php _e('Categories', CSDOMAIN); ?> :</span>
<?php
/* translators: used between list items, there is a space after the comma */
$before_cat = " ".__( '',CSDOMAIN );
$categories_list = get_the_term_list ( get_the_id(), 'artist-category', $before_cat, ', ', '' );
if ( $categories_list ): printf( __( '%1$s', CSDOMAIN ),$categories_list ); endif; '</p>';
?>
</p>
<br>
<h5><?php print_custom_field('stars:formatted_list', array('<li><img src="http://www.entertaininc.co.uk/wp-content/uploads/2015/09/gold-star-graphic-e1441218522835.png">[+value+]</li>','<ul>[+content+]</ul>') );
?></h5><br />
<h2><strong>Price</strong> <?php print_custom_field('price'); ?></h2> <br />
<h2><strong>Location</strong> <?php echo do_shortcode('[gmw_post_info info="city, country" divider=","]'); ?></h2><br />
<h4><?php _e('Description', CSDOMAIN); ?></h4>
<div class='txt rich_editor_text'>
<?php
the_content();
?>
</div>
<div class="clear"></div>
<?php edit_post_link( __( 'Edit', CSDOMAIN ), '<span class="edit-link">', '</span>' ); ?>
</div></div>
</div>
<div class="clear"></div>
</div>
</div>
<div class="in-sec">
<div class="artist-opts">
<div class="share-artist">
<?php
$cs_social_share = get_option("cs_social_share");
if($cs_social_share != ''){
$xmlObject_artist = new SimpleXMLElement($cs_social_share);
if($artist_social_share == 'Yes'){
social_share();
}?>
<?php }?>
</div>
<?php if($artist_buy_amazon != '' or $artist_buy_apple != '' or $artist_buy_groov != '' or $artist_buy_cloud != ''){?>
<div class="availble">
<h4><?php if($cs_transwitch =='on'){ _e('Buy This',CSDOMAIN); }else{ echo __CS('buy_now', 'Buy This'); }?></h4>
<?php
if ( $artist_buy_amazon <> "" ) echo ' <a target="_blank" href="'.$artist_buy_amazon.'" class="amazon-ind"> <span>';if($cs_transwitch =='on'){ _e('Amazon',CSDOMAIN); }else{ echo __CS('amazon', 'Amazon'); } echo '</span></a> ';
if ( $artist_buy_apple <> "") echo ' <a target="_blank" href="'.$artist_buy_apple.'" class="apple-ind"> <span>'; if($cs_transwitch =='on'){ _e('Apple',CSDOMAIN); }else{ echo __CS('itunes', 'iTunes'); } echo '</span></a> ';
if ( $artist_buy_groov <> "") echo ' <a target="_blank" href="'.$artist_buy_groov.'" class="grooveshark-ind"> <span>'; if($cs_transwitch =='on'){ _e('GrooveShark',CSDOMAIN); }else{ echo __CS('grooveshark', 'GrooveShark'); } echo '</span></a> ';
if ( $artist_buy_cloud <> "") echo ' <a target="_blank" href="'.$artist_buy_cloud.'" class="soundcloud-ind"> <span>'; if($cs_transwitch =='on'){ _e('SoundCloud',CSDOMAIN); }else{ echo __CS('soundcloud', 'SoundCloud '); } echo '</span></a> ';
?>
</div>
<?php }?>
<div class="clear"></div>
</div>
</div>
<?php
foreach ( $xmlObject as $track ){
if ( $track->getName() == "track" ) {
?>
<div class="in-sec">
<?php
enqueue_alubmtrack_format_resources();
?>
<div class="artist-tracks light-box">
<?php
$counter = 0;
foreach ( $xmlObject as $track ){
$counter++;
if ( $track->getName() == "track" ) {
echo "<div class='track'>";
echo "<h5>";
echo $artist_track_title = $track->artist_track_title;
echo "</h5>";
echo "<ul>";
if ($track->artist_track_playable == "Yes") {
echo '
<li>
<div class="cp-container cp_container_'.$counter.'">
<ul class="cp-controls">
<li><a style="display: block;" href="#" class="cp-play" tabindex="1"> <span>'; if($cs_transwitch =='on'){ _e('Play',CSDOMAIN); }else{ echo __CS('play', 'Play'); } echo '</span></a></li>
<li> <span>'; if($cs_transwitch =='on'){ _e('Pause',CSDOMAIN); }else{ echo __CS('pause', 'Pause'); } echo '</span></li>
</ul>
</div>
<div style="width: 0px; height: 0px;" class="cp-jplayer jquery_jplayer_'.$counter.'">
<img style="width: 0px; height: 0px; display: none;" id="jp_poster_0">
<audio src="'.$track->artist_track_mp3_url.'" preload="metadata" ></audio>
</div>
<script>
jQuery(document).ready(function($){
var myCirclePlayer = new CirclePlayer(".jquery_jplayer_'.$counter.'",
{
mp3: "'.$track->artist_track_mp3_url.'"
}, {
cssSelectorAncestor: ".cp_container_'.$counter.'",
swfPath: "'.get_template_directory_uri().'/scripts/frontend/Jplayer.swf",
wmode: "window",
supplied: "mp3"
});
});
</script>
</li>
';
}
if ($track->artist_track_downloadable == "Yes"){ echo '<li> <span>'; if($cs_transwitch =='on'){ _e('Download',CSDOMAIN); }else{ echo __CS('download', 'Download'); } echo '</span></li>'; }
if ($track->artist_track_lyrics <> "") { echo '<li> <span>'; if($cs_transwitch =='on'){ _e('Lyrics',CSDOMAIN); }else{ echo __CS('lyrics', 'Lyrics'); } echo '</span></li>';}
if ($track->artist_track_buy_mp3 <> ""){ echo '<li> <span>'; if($cs_transwitch =='on'){ _e('Buy Song',CSDOMAIN); }else{ echo __CS('buy_now', 'Buy Song'); } echo '</span></li>';}
echo "</ul>";
echo '
<div id="lyrics'.$counter.'" style="display:none;">
'.str_replace("\n","</br>",$track->artist_track_lyrics).'
</div>
';
echo "</div>";
}
}
?>
<div class="clear"></div>
</div>
</div>
<?php
}
}
?>
<div class="clear"></div>
<?php if ( get_the_author_meta( 'description' ) ) :?>
<div class="in-sec" style="margin-top:20px;">
<div class="about-author">
<div class="avatars">
<?php echo get_avatar( get_the_author_meta( 'user_email' ), apply_filters( 'PixFill_author_bio_avatar_size', 53 ) ); ?>
</div>
<div class="desc">
<h5><?php _e('About', CSDOMAIN); ?> <?php echo get_the_author(); ?></h5>
<p class="txt">
<?php the_author_meta( 'description' ); ?>
</p>
<div class="clear"></div>
</div>
<div class="clear"></div>
</div>
</div>
<?php endif; ?>
</div>
<?php endwhile; endif; // end of the loop. ?>
<?php comments_template( '', true ); ?>
</div>
<?php if( $cs_layout != "sixteen columns left" and isset($show_sidebar) ) { ?>
<!--Sidebar Start-->
<div class="one-third column left">
<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar($show_sidebar) ) : ?>
<?php endif; ?>
</div>
<!--Sidebar Ends-->
<?php }?>
<div class="clear"></div><!-- #content -->
</div><!-- #container -->
<div class="clear"></div>
<?php get_footer(); ?>
You need to use jQuery UI library (draggable) - https://jqueryui.com/draggable/
And then read the offset of the div or so
You also can use a jquery plugin named draggabilly. See the event dragMove or dragEnd. Hope it helps.

Wordpress: How to overlay text / widget div on top of a revolution slider

We are using Elision WP theme. We have a revolution slider on home pulled via shortcode in theme backend settings. We need to have static text on top of slides.
Revolution slider is set to 1100px x 680px and we want the "hero-text" div to be located on the lower left corner with a 20px from left and 50px from bottom. It also needs to be responsive.
Attached: layout image link, homepage.php code.
http://www.image-share.com/ijpg-2756-164.html
<?php
/*
Template Name: Homepage
*/
?>
<?php
global $wp_query;
$id = $wp_query->get_queried_object_id();
$sidebar = get_post_meta($id, "qode_show-sidebar", true);
if ( get_query_var('paged') ) { $paged = get_query_var('paged'); }
elseif ( get_query_var('page') ) { $paged = get_query_var('page'); }
else { $paged = 1; }
if(get_post_meta($id, "qode_responsive-title-image", true) != ""){
$responsive_title_image = get_post_meta($id, "qode_responsive-title-image", true);
}else{
$responsive_title_image = $qode_options_elision['responsive_title_image'];
}
if(get_post_meta($id, "qode_fixed-title-image", true) != ""){
$fixed_title_image = get_post_meta($id, "qode_fixed-title-image", true);
}else{
$fixed_title_image = $qode_options_elision['fixed_title_image'];
}
if(get_post_meta($id, "qode_title-image", true) != ""){
$title_image = get_post_meta($id, "qode_title-image", true);
}else{
$title_image = $qode_options_elision['title_image'];
}
$title_image_height = "";
$title_image_width = "";
if(!empty($title_image)){
$title_image_url_obj = parse_url($title_image);
if (file_exists($_SERVER['DOCUMENT_ROOT'].$title_image_url_obj['path']))
list($title_image_width, $title_image_height, $title_image_type, $title_image_attr) = getimagesize($_SERVER['DOCUMENT_ROOT'].$title_image_url_obj['path']);
}
if(get_post_meta($id, "qode_title-height", true) != ""){
$title_height = get_post_meta($id, "qode_title-height", true);
}else{
$title_height = $qode_options_elision['title_height'];
}
$title_background_color = '';
if(get_post_meta($id, "qode_page-title-background-color", true) != ""){
$title_background_color = get_post_meta($id, "qode_page-title-background-color", true);
}else{
$title_background_color = $qode_options_elision['title_background_color'];
}
$show_title_image = true;
if(get_post_meta($id, "qode_show-page-title-image", true)) {
$show_title_image = false;
}
$qode_page_title_style = "standard";
if(get_post_meta($id, "qode_page_title_style", true) != ""){
$qode_page_title_style = get_post_meta($id, "qode_page_title_style", true);
}else{
if(isset($qode_options_elision['title_style'])) {
$qode_page_title_style = $qode_options_elision['title_style'];
} else {
$qode_page_title_style = "standard";
}
}
$height_class = "";
if($qode_page_title_style == "title_on_bottom") {
$height_class = " title_on_bottom";
}
$enable_page_comments = false;
if(get_post_meta($id, "qode_enable-page-comments", true)) {
$enable_page_comments = true;
}
?>
<?php get_header(); ?>
<?php if(get_post_meta($id, "qode_page_scroll_amount_for_sticky", true)) { ?>
<script>
var page_scroll_amount_for_sticky = <?php echo get_post_meta($id, "qode_page_scroll_amount_for_sticky", true); ?>;
</script>
<?php } ?>
<?php if(!get_post_meta($id, "qode_show-page-title", true)) { ?>
<div class="title<?php echo $height_class; ?> <?php if($responsive_title_image == 'no' && $title_image != "" && ($fixed_title_image == "yes" || $fixed_title_image == "yes_zoom") && $show_title_image == true){ echo 'has_fixed_background '; if($fixed_title_image == "yes_zoom"){ echo 'zoom_out '; } } if($responsive_title_image == 'no' && $title_image != "" && $fixed_title_image == "no" && $show_title_image == true){ echo 'has_background'; } if($responsive_title_image == 'yes' && $show_title_image == true){ echo 'with_image'; } ?>" style="<?php if($responsive_title_image == 'no' && $title_image != "" && $show_title_image == true){ if($title_image_width != ''){ echo 'background-size:'.$title_image_width.'px auto;'; } echo 'background-image:url('.$title_image.');'; } if($title_height != ''){ echo 'height:'.$title_height.'px;'; } if($title_background_color != ''){ echo 'background-color:'.$title_background_color.';'; } ?>">
<div class="image <?php if($responsive_title_image == 'yes' && $title_image != "" && $show_title_image == true){ echo "responive"; }else{ echo "not_responsive"; } ?>"><?php if($title_image != ""){ ?><img src="<?php echo $title_image; ?>" alt=" " /> <?php } ?></div>
<?php if(!get_post_meta($id, "qode_show-page-title-text", true)) { ?>
<div class="title_holder">
<div class="container">
<div class="container_inner clearfix">
<?php if($qode_page_title_style == "title_on_bottom") { ?>
<div class="title_on_bottom_wrap">
<div class="title_on_bottom_holder">
<div class="title_on_bottom_holder_inner" <?php if(get_post_meta($id, "qode_page_title_holder_color", true)) { ?> style="background-color:<?php echo get_post_meta($id, "qode_page_title_holder_color", true) ?>" <?php } ?>>
<h1<?php if(get_post_meta($id, "qode_page-title-color", true)) { ?> style="color:<?php echo get_post_meta($id, "qode_page-title-color", true) ?>" <?php } ?>><span><?php the_title(); ?></span></h1>
</div>
</div>
</div>
<?php } else { ?>
<h1<?php if(get_post_meta($id, "qode_page-title-color", true)) { ?> style="color:<?php echo get_post_meta($id, "qode_page-title-color", true) ?>" <?php } ?>><span><?php the_title(); ?></span></h1>
<?php } ?>
</div>
</div>
</div>
<?php } ?>
</div>
<?php } ?>
<?php
$revslider = get_post_meta($id, "qode_revolution-slider", true);
if (!empty($revslider)){ ?>
<div class="q_slider"><div class="q_slider_inner">
<?php echo do_shortcode($revslider); ?>
</div></div>
<?php
}
?>
<div class="full_width">
<div class="full_width_inner">
<?php if(($sidebar == "default")||($sidebar == "")) : ?>
<?php if (have_posts()) :
while (have_posts()) : the_post(); ?>
<?php the_content(); ?>
<?php
$args_pages = array(
'before' => '<p class="single_links_pages">',
'after' => '</p>',
'pagelink' => '<span>%</span>'
);
wp_link_pages($args_pages); ?>
<?php
if($enable_page_comments){
?>
<div class="container">
<div class="container_inner">
<?php
comments_template('', true);
?>
</div>
</div>
<?php
}
?>
<?php endwhile; ?>
<?php endif; ?>
<?php elseif($sidebar == "1" || $sidebar == "2"): ?>
<?php if($sidebar == "1") : ?>
<div class="two_columns_66_33 clearfix grid2">
<div class="column1">
<?php elseif($sidebar == "2") : ?>
<div class="two_columns_75_25 clearfix grid2">
<div class="column1">
<?php endif; ?>
<?php if (have_posts()) :
while (have_posts()) : the_post(); ?>
<div class="column_inner">
<?php the_content(); ?>
<?php
$args_pages = array(
'before' => '<p class="single_links_pages">',
'after' => '</p>',
'pagelink' => '<span>%</span>'
);
wp_link_pages($args_pages); ?>
<?php
if($enable_page_comments){
?>
<div class="container">
<div class="container_inner">
<?php
comments_template('', true);
?>
</div>
</div>
<?php
}
?>
</div>
<?php endwhile; ?>
<?php endif; ?>
</div>
<div class="column2"><?php get_sidebar();?></div>
</div>
<?php elseif($sidebar == "3" || $sidebar == "4"): ?>
<?php if($sidebar == "3") : ?>
<div class="two_columns_33_66 clearfix grid2">
<div class="column1"><?php get_sidebar();?></div>
<div class="column2">
<?php elseif($sidebar == "4") : ?>
<div class="two_columns_25_75 clearfix grid2">
<div class="column1"><?php get_sidebar();?></div>
<div class="column2">
<?php endif; ?>
<?php if (have_posts()) :
while (have_posts()) : the_post(); ?>
<div class="column_inner">
<?php the_content(); ?>
<?php
$args_pages = array(
'before' => '<p class="single_links_pages">',
'after' => '</p>',
'pagelink' => '<span>%</span>'
);
wp_link_pages($args_pages); ?>
<?php
if($enable_page_comments){
?>
<div class="container">
<div class="container_inner">
<?php
comments_template('', true);
?>
</div>
</div>
<?php
}
?>
</div>
<?php endwhile; ?>
<?php endif; ?>
</div>
</div>
<?php endif; ?>
</div>
</div>
<?php get_footer(); ?>
I'm not sure how you're planning to get your static headline onto the page. You could hard code it in there as I am about to show you below or you could create a custom field. If you decide to take that route, I find that Advanced Custom Fields is really easy to use.
<?php
$revslider = get_post_meta($id, "qode_revolution-slider", true);
if (!empty($revslider)){ ?>
<div class="q_slider"><div class="q_slider_inner">
<h1 class="static-headline">Your awesome text goes here</h1>
<?php echo do_shortcode($revslider); ?>
</div></div>
<?php
Add the following CSS to your site to position it in the correct place:
.q_slider_inner { position: relative; }
.static-headline {
position: absolute;
bottom: 5%;
left: 2%;
color: #fff;
z-index: 21;
}
You'll need to play around with the percentages to get the headline exactly where you need it but I recommend using % over px values since you want this to be responsive.
I hope this helps.

Define number of images per row in PHP generated image gallery?

Currently my image gallery has 4 images per row. If the screen is minimized below the width of those 4 images, one image will drop to the next line and there will be a line break before the next row. Is there any way to make gallery continuous instead of having the break in images when the screen is resized? Ideally, I would like to start with 5 images per row, then if the viewer has a smaller screen, it will automatically adjust the number of images per row to fit whatever size window they are using.
Here is a link to the gallery: http://rabbittattoo.com/?gallery=gallery
And the PHP:
$pp_gallery_style = get_option('pp_gallery_style');
if($pp_gallery_style == 'f')
{
include_once(TEMPLATEPATH.'/gallery-f.php');
exit;
}
if(!isset($hide_header) OR !$hide_header)
{
get_header();
}
$caption_class = "page_caption";
$portfolio_sets_query = '';
$custom_title = '';
if(!empty($term))
{
$portfolio_sets_query.= $term;
$obj_term = get_term_by('slug', $term, 'photos_galleries');
$custom_title = $obj_term->name;
}
else
{
$custom_title = get_the_title();
}
/**
* Get Current page object
**/
$page = get_page($post->ID);
/**
* Get current page id
**/
if(!isset($current_page_id) && isset($page->ID))
{
$current_page_id = $page->ID;
}
if(!isset($hide_header) OR !$hide_header)
{
?>
<div class="wrapper_shadow"></div>
<div class="page_caption">
<div class="caption_inner">
<div class="caption_header">
<h1 class="cufon"><?php echo the_title(); ?></h1>
</div>
</div>
</div>
</div>
<!-- Begin content -->
<div id="content_wrapper">
<div class="inner">
<!-- Begin main content -->
<div id="gallery_wrapper" class="inner_wrapper portfolio">
<div class="standard_wrapper small">
<br class="clear"/><br/>
<?php
}
else
{
echo '<br class="clear"/>';
}
?>
<?php echo do_shortcode(html_entity_decode($page->post_content)); ?>
<!-- Begin portfolio content -->
<?php
$menu_sets_query = '';
$portfolio_items = 0;
$portfolio_sort = get_option('pp_gallery_sort');
if(empty($portfolio_sort))
{
$portfolio_sort = 'DESC';
}
$args = array(
'post_type' => 'attachment',
'numberposts' => $portfolio_items,
'post_status' => null,
'post_parent' => $post->ID,
'order' => $portfolio_sort,
'orderby' => 'date',
);
$all_photo_arr = get_posts( $args );
if(isset($all_photo_arr) && !empty($all_photo_arr))
{
?>
<?php
foreach($all_photo_arr as $key => $portfolio_item)
{
$image_url = '';
if(!empty($portfolio_item->guid))
{
$image_id = $portfolio_item->ID;
$image_url[0] = $portfolio_item->guid;
}
$last_class = '';
$line_break = '';
if(($key+1) % 4 == 0)
{
$last_class = ' last';
if(isset($page_photo_arr[$key+1]))
{
$line_break = '<br class="clear"/><br/>';
}
else
{
$line_break = '<br class="clear"/>';
}
}
?>
<div class="one_fourth<?php echo $last_class?>" style="margin-right:24px;margin-bottom:24px;margin-top:-20px">
<a title="<?php echo $portfolio_item->post_title?>" href="<?php echo $image_url[0]?>" class="one_fourth_img" rel="gallery" href="<?php echo $image_url[0]?>">
<img src="<?php echo get_stylesheet_directory_uri(); ?>/timthumb.php?src=<?php echo $image_url[0]?>&h=370&w=350&zc=1" alt=""/>
</a>
</div>
<?php
echo $line_break;
}
//End foreach loop
?>
<?php
}
//End if have portfolio items
?>
</div>
<!-- End main content -->
<br class="clear"/><br/>
</div>
<?php
if(!isset($hide_header) OR !$hide_header)
{
?>
</div>
<!-- End content -->
<?php get_footer(); ?>
<?php
}
?>
Thank you in advance for you help!

Wordpress Magnifying function using images from custom filed "et_gallery"

The goal effect is: When clicked on the magnifying icon, it uses the "Fancybox" plugin to display big size images (mutiple images separated by commas) in the custom filed "et_gallery".
Right now the magnifying isn't working at all.
http://heidixu.com/#!/?page_id=4
It was working fine once. And then I accidently replaced the final code with an earlier version. So the version I currently have is pretty close but something is not right or missing and I can't figure out what because I'm not an expert in php...
This is the page: http://heidixu.com/#!/?page_id=4 and every other pages with thumbnails work the same.
This is my current version of php code that was edited:
<?php
/*
Template Name: Portfolio Page
*/
?>
<?php
$et_ptemplate_settings = array();
$et_ptemplate_settings = maybe_unserialize( get_post_meta($post->ID,'et_ptemplate_settings',true) );
$fullwidth = true;
$et_ptemplate_showtitle = isset( $et_ptemplate_settings['et_ptemplate_showtitle'] ) ? (bool) $et_ptemplate_settings['et_ptemplate_showtitle'] : false;
$et_ptemplate_showdesc = isset( $et_ptemplate_settings['et_ptemplate_showdesc'] ) ? (bool) $et_ptemplate_settings['et_ptemplate_showdesc'] : false;
$et_ptemplate_detect_portrait = isset( $et_ptemplate_settings['et_ptemplate_detect_portrait'] ) ? (bool) $et_ptemplate_settings['et_ptemplate_detect_portrait'] : false;
$gallery_cats = isset( $et_ptemplate_settings['et_ptemplate_gallerycats'] ) ? (array) $et_ptemplate_settings['et_ptemplate_gallerycats'] : array();
$et_ptemplate_gallery_perpage = isset( $et_ptemplate_settings['et_ptemplate_gallery_perpage'] ) ? (int) $et_ptemplate_settings['et_ptemplate_gallery_perpage'] : 12;
$et_ptemplate_portfolio_size = isset( $et_ptemplate_settings['et_ptemplate_imagesize'] ) ? (int) $et_ptemplate_settings['et_ptemplate_imagesize'] : 2;
$et_ptemplate_portfolio_class = '';
if ( $et_ptemplate_portfolio_size == 1 ) $et_ptemplate_portfolio_class = ' et_portfolio_small';
if ( $et_ptemplate_portfolio_size == 3 ) $et_ptemplate_portfolio_class = ' et_portfolio_large';
?>
<?php get_header(); ?>
<div class="single_container et_shadow">
<div class="single_content">
<div class="entry post clearfix">
<?php get_template_part('loop','page'); ?>
<div id="et_pt_portfolio_gallery" class="clearfix<?php echo $et_ptemplate_portfolio_class; ?>">
<?php $gallery_query = '';
$portfolio_count = 1;
$et_open_row = false;
if ( !empty($gallery_cats) ) $gallery_query = '&cat=' . implode(",", $gallery_cats);
else echo '<!-- gallery category is not selected -->'; ?>
<?php
$et_paged = is_front_page() ? get_query_var( 'page' ) : get_query_var( 'paged' );
?>
<?php query_posts("showposts=$et_ptemplate_gallery_perpage&paged=" . $et_paged . $gallery_query); ?>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<?php $width = 260;
$height = 170;
if ( $et_ptemplate_portfolio_size == 1 ) {
$width = 140;
$height = 94;
$et_portrait_height = 170;
}
if ( $et_ptemplate_portfolio_size == 2 ) $et_portrait_height = 315;
if ( $et_ptemplate_portfolio_size == 3 ) {
$width = 430;
$height = 283;
$et_portrait_height = 860;
}
$et_auto_image_detection = false;
if ( has_post_thumbnail( $post->ID ) && $et_ptemplate_detect_portrait ) {
$wordpress_thumbnail = get_post( get_post_thumbnail_id($post->ID) );
$wordpress_thumbnail_url = $wordpress_thumbnail->guid;
if ( et_is_portrait($wordpress_thumbnail_url) ) $height = $et_portrait_height;
}
$titletext = get_the_title();
$et_portfolio_title = get_post_meta($post->ID,'et_portfolio_title',true) ? get_post_meta($post->ID,'et_portfolio_title',true) : get_the_title();
$et_videolink = get_post_meta($post->ID,'et_videolink',true) ? get_post_meta($post->ID,'et_videolink',true) : '';
$thumbnail = get_thumbnail($width,$height,'',$titletext,$titletext,true,'et_portfolio');
$thumb = $thumbnail["thumb"];
if ( $et_ptemplate_detect_portrait && $thumbnail["use_timthumb"] && et_is_portrait($thumb) ) {
$height = $et_portrait_height;
} ?>
<?php if ( $portfolio_count == 1 || ( $et_ptemplate_portfolio_size == 2 && (!$fullwidth && ($portfolio_count+1) % 2 == 0) ) || ( $et_ptemplate_portfolio_size == 3 && (($portfolio_count+1) % 2 == 0) ) ) {
$et_open_row = true; ?>
<div class="et_pt_portfolio_row clearfix">
<?php } ?>
<div class="et_pt_portfolio_item">
<?php if ($et_ptemplate_showtitle) { ?>
<h2 class="et_pt_portfolio_title"><?php echo $et_portfolio_title; ?></h2>
<?php } ?>
<div class="et_pt_portfolio_entry<?php if ( $height == $et_portrait_height ) echo ' et_portrait_layout'; ?>">
<div class="et_pt_portfolio_image<?php if ($et_videolink <> '') echo ' et_video'; ?>">
<?php print_thumbnail($thumb, $thumbnail["use_timthumb"], $titletext, $width, $height, ''); ?>
<?php $gallery = explode(',', get_post_meta($post->ID, 'et_gallery', true));
foreach ($gallery as $item) { ?>
<a class="fancybox" href="<?php echo $item; ?>" style="display: none;" rel="gallery[<?php echo $post->ID; ?>]" title="<?php the_title(); ?>"></a>
<?php } ?>
<span class="et_pt_portfolio_overlay"></span>
<a class="et_portfolio_zoom_icon <?php if ($et_videolink <> '') echo 'et_video_lightbox'; else echo('fancybox'); ?>" title="<?php the_title(); ?>"<?php if ($et_videolink == '') echo ' rel="gallery[' . $post->ID . '"]'; ?> href="<?php if ($et_videolink <> '') echo $et_videolink; else echo($thumbnail['fullpath']); ?>"><?php esc_html_e('Zoom in','Sky'); ?></a>
<a class="et_portfolio_more_icon" href="<?php the_permalink(); ?>"><?php esc_html_e('Read more','Sky'); ?></a>
</div> <!-- end .et_pt_portfolio_image -->
</div> <!-- end .et_pt_portfolio_entry -->
<?php if ($et_ptemplate_showdesc) { ?>
<p><?php truncate_post(90); ?></p>
<?php } ?>
</div> <!-- end .et_pt_portfolio_item -->
<?php if ( ($et_ptemplate_portfolio_size == 2 && !$fullwidth && $portfolio_count % 2 == 0) || ( $et_ptemplate_portfolio_size == 3 && ($portfolio_count % 2 == 0) ) ) {
$et_open_row = false; ?>
</div> <!-- end .et_pt_portfolio_row -->
<?php } ?>
<?php if ( ($et_ptemplate_portfolio_size == 2 && $fullwidth && $portfolio_count % 3 == 0) || ($et_ptemplate_portfolio_size == 1 && !$fullwidth && $portfolio_count % 3 == 0) || ($et_ptemplate_portfolio_size == 1 && $fullwidth && $portfolio_count % 5 == 0) ) { ?>
</div> <!-- end .et_pt_portfolio_row -->
<div class="et_pt_portfolio_row clearfix">
<?php $et_open_row = true; ?>
<?php } ?>
<?php $portfolio_count++;
endwhile; ?>
<?php if ( $et_open_row ) {
$et_open_row = false; ?>
</div> <!-- end .et_pt_portfolio_row -->
<?php } ?>
<div class="page-nav clearfix">
<?php if (function_exists('wp_pagenavi')) { wp_pagenavi(); }
else { ?>
<?php get_template_part('includes/navigation'); ?>
<?php } ?>
</div> <!-- end .entry -->
<?php else : ?>
<?php if ( $et_open_row ) {
$et_open_row = false; ?>
</div> <!-- end .et_pt_portfolio_row -->
<?php } ?>
<?php get_template_part('includes/no-results'); ?>
<?php endif; wp_reset_query(); ?>
<?php if ( $et_open_row ) {
$et_open_row = false; ?>
</div> <!-- end .et_pt_portfolio_row -->
<?php } ?>
</div> <!-- end #et_pt_portfolio_gallery -->
</div> <!-- end .entry -->
</div> <!-- end .single_content -->
<div class="content-bottom"></div>
</div> <!-- end .single_container -->
<?php if (get_option('sky_show_pagescomments') == 'on') comments_template('', true); ?>
Could any php experts please take a look. Thank you so much.
-Heidi
So far, when you click on the magnifying icon, it produces this error:
Error: a is undefined
Source File: http://heidixu.com/wp-content/themes/Sky/epanel/page_templates/js/fancybox/jquery.fancybox-1.3.4.pack.js?ver=1.3.4
Line: 19
It looks like the link (the <a> tag) is not bound to fancybox regardless it has the specified class.
I want to believe that your generated code is not well formed; you have this html:
Zoom in
and wonder if this part specifically
... ]="" rel="gallery[ ....
...is creating the error. I cannot find what part of your php code generates those (misplaced?) brackets.

Categories