Forum Replies Created

Viewing 5 replies - 1 through 5 (of 5 total)
  • Thread Starter e_vera

    (@e_vera)

    Hi Ben, and thanks a lot for your answer!
    I’ve fiddled around and I just cannot get the hover effect to work.
    I’ve uploaded all the necessary files to the server, linked to them in the content-post-grid.php file.

    I’ve tried changing the code so that the img comes first and tried adding a link to the post according to this sample:

     <div id="effect-5" class="effects clearfix">
                <div class="img">
                    <img src="link to featured image" alt="">
                    <div class="overlay">
                        <a href="link to post ID" class="expand">+</a>
                        <a class="close-overlay hidden">x</a>
                    </div>
                </div>
      </div>

    All this results in is the featured images with a + and a x below them and no link actually ON them.

    This is what my vanilla file looks like:

    <?php global $post, $pinnacle, $postcolumn; 
                if(!empty($postcolumn)) {
                  if($postcolumn == '3') {
                    $image_width = 370; 
                    $image_height = 246;
                    $titletag = "h5";
                  } else if($postcolumn == '2') {
                    $image_width = 560;
                    $image_height = 370;
                    $titletag = "h4";
                  } else {
                    $image_width = 340;
                    $image_height = 226;
                    $titletag = "h5";
                  }
                } else {
                  $image_width = 340;
                  $image_height = 226;
                  $titletag = "h5";
                }
                if(isset($pinnacle['postexcerpt_hard_crop']) && $pinnacle['postexcerpt_hard_crop'] == 1) {
                  $hardcrop = true;
                } else {
                  $hardcrop = false;
                }
                if ( has_post_format( 'video' )) {
                  $postsummery = get_post_meta( $post->ID, '_kad_video_post_summery', true );
                  if(empty($postsummery) || $postsummery == 'default') {
                    if(!empty($pinnacle['video_post_summery_default'])) {
                        $postsummery = $pinnacle['video_post_summery_default'];
                      } else {
                        $postsummery = 'video';
                    }
                  }
                } else if (has_post_format( 'gallery' )) {
                  $postsummery = get_post_meta( $post->ID, '_kad_gallery_post_summery', true );
                  if(empty($postsummery) || $postsummery == 'default') {
                    if(!empty($pinnacle['gallery_post_summery_default'])) {
                        $postsummery = $pinnacle['gallery_post_summery_default'];
                    } else {
                        $postsummery = 'slider_landscape';
                    }
                  }
                } elseif (has_post_format( 'image' )) {
                  $postsummery = get_post_meta( $post->ID, '_kad_image_post_summery', true );
                  if(empty($postsummery) || $postsummery == 'default') {
                    if(!empty($pinnacle['image_post_summery_default'])) {
                        $postsummery = $pinnacle['image_post_summery_default'];
                    } else {
                        $postsummery = 'img_portrait';
                    }
                  }
                } else {
                  if(!empty($pinnacle['post_summery_default'])) {
                     $postsummery = $pinnacle['post_summery_default'];
                  } else {
                     $postsummery = 'img_landscape';
                  }
                }
                if($postsummery == 'img_landscape' && has_post_thumbnail( $post->ID ) || $postsummery == 'img_portrait' && has_post_thumbnail( $post->ID )) { ?>
                    <div id="post-<?php the_ID(); ?>" class="blog_item postclass kad_blog_fade_in grid_item" itemscope="" itemtype="http://schema.org/BlogPosting">
                        <?php $image_id = get_post_thumbnail_id( $post->ID );
                              $image_url = wp_get_attachment_image_src($image_id, 'full' ); 
                              $thumbnailURL = $image_url[0];
                              if($hardcrop) {
                                $image = aq_resize($thumbnailURL, $image_width, $image_height, true, false);
                              } else {
                                $image = aq_resize($thumbnailURL, $image_width, null, false, false);
                              }
                              if(empty($image[0])) {$image = array($thumbnailURL,$image_width,$image_height);} ?>
                                  <div class="imghoverclass img-margin-center">
                                    <a href="<?php the_permalink()  ?>" title="<?php the_title(); ?>">
                                      <img src="<?php echo esc_url($image[0]); ?>" alt="<?php the_title(); ?>" width="<?php echo esc_attr($image[1]);?>" height="<?php echo esc_attr($image[2]);?>" <?php echo kt_get_srcset_output( $image[1], $image[2], $thumbnailURL, $image_id);?> itemprop="image" class="iconhover" style="display:block;">
                                    </a> 
                                  </div>
                                  <?php $image = null; $thumbnailURL = null; ?>
                <?php } elseif($postsummery == 'slider_landscape' || $postsummery == 'slider_portrait' || $postsummery == 'gallery_grid') {?>
                    <div id="post-<?php the_ID(); ?>" class="blog_item postclass kad_blog_fade_in grid_item" itemscope="" itemtype="http://schema.org/BlogPosting">
                              <div class="flexslider kt-flexslider loading" style="max-width:<?php echo esc_attr($image_width);?>px;" data-flex-speed="7000" data-flex-anim-speed="400" data-flex-animation="fade" data-flex-auto="true">
                                <ul class="slides">
                                  <?php $image_gallery = get_post_meta( $post->ID, '_kad_image_gallery', true );
                                        if(!empty($image_gallery)) {
                                          $attachments = array_filter( explode( ',', $image_gallery ) );
                                          if ($attachments) {
                                              foreach ($attachments as $attachment) {
                                                $attachment_url = wp_get_attachment_url($attachment , 'full');
                                                $image = aq_resize($attachment_url, $image_width, $image_height, true);
                                                if(empty($image)) {$image = $attachment_url;} ?>
                                                <li>
                                                    <a href="<?php the_permalink() ?>">
                                                        <img src="<?php echo esc_url($image); ?>" <?php echo 'width="'.esc_attr($image_width).'" height="'.esc_attr($image_height).'"';?> <?php echo kt_get_srcset_output( $image_width, $image_height, $attachment_url, $attachment);?> itemprop="image" class="" alt="<?php the_title(); ?>" />
                                                    </a>
                                                </li>
                                              <?php }
                                          }
                                        } ?>                                 
                                </ul>
                              </div> <!--Flex Slides-->
                <?php } elseif($postsummery == 'video') {?>
                    <div id="post-<?php the_ID(); ?>" class="blog_item postclass kad_blog_fade_in grid_item" itemscope="" itemtype="http://schema.org/BlogPosting">
                            <div class="videofit">
                                <?php echo get_post_meta( $post->ID, '_kad_post_video', true ); ?>
                            </div>
                <?php } else {?>
                    <div id="post-<?php the_ID(); ?>" class="blog_item postclass kad_blog_fade_in grid_item" itemscope="" itemtype="http://schema.org/BlogPosting">
                <?php }?>
                    </div> <!-- Blog Item -->
    Thread Starter e_vera

    (@e_vera)

    Okay, I’ve looked further and found the file 🙂 It’s templates/content-post-grid.php and I had to remove a few bits at the end.

    Now all that’s missing is an image overlay similar to this one: http://callmenick.com/_development/image-overlay-hover-effects/index-5.html

    Can anybody tell me how to achieve that, ideally using the div’s that already exist?

    Thread Starter e_vera

    (@e_vera)

    Hi Hannah!

    I’m using the free theme, but I wouldn’t mind going through the code. I just need to know which file the segment is stored in.

    Can’t post a link because the site is still in maintenance and for a friend, he doesn’t want anything to get out before it’s done… :/

    Thread Starter e_vera

    (@e_vera)

    Hi wp-newbee!
    I don’t remember exactly which files were necessary for the changes to take place and which weren’t, but generally, you just have to replace every the_excerpt with the_content.

    Here are the files I believe I changed:
    wp-content/themes/cirrus/parts/blog-content.php
    wp-content/themes/cirrus/index.php

    You also need to change
    wp-content/themes/cirrus/single.php
    if you want the posts to be fully visible when viewing them singular and not on the frontpage.

    I also recommend installing the plugin W3 Total Cache before you make those changes, so you can easily clear the page’s caches and actually see your results (oftentimes I wouldn’t see them right away although I cleared my browser’s cache).

    Hope I could help!

    Thread Starter e_vera

    (@e_vera)

    Hi Miha, and thank you!
    The index.php was fine, but I found the solution in another folder and another file (seems the frontpage content calls from that file). Thanks a lot!! 😀

Viewing 5 replies - 1 through 5 (of 5 total)