Category: FAQ

How to add Facebook like button to upPrev box?

You can use iworks_upprev_box_item filter, to modify item element.

<?php
add_filter( 'iworks_upprev_box_item', 'iworks_upprev_box_facebook_like' );
function iworks_upprev_box_facebook_like($content)
{
    /**
     * change this for your data
     */
    $appId = 279100175534801;
    $like_page = site_url();

    ob_start();
?>
<hr />
<div id="fb-root"&</div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/<?php echo get_locale(); ?>/all.js#xfbml=1&appId=<?php echo $appId; ?>";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</>
<div class="fb-like" data-href="<?php echo $like_page; ?>" data-layout="standard" data-action="like" data-show-faces="false" data-share="false"></div>
<?php
    $content .= ob_get_contents();
    ob_end_clean();
    return $content;
}

Get code: upprev_add_fb_like_to_box.php

Where to put this code?

There are three ways:

  1. made a one-file-plugin and put file into wp-content/plugins, then turn it on
  2. made a one-file-plugin and put file into wp-content/mu-plugins
  3. put this code into functions.php in current theme

I recommend using option 1 or 2, but 3 is the easiest.

Is there a way I can use non-post content in this plugin?

Yes. You can use one of build-in filters:

To replace whole box:

add_filter( 'iworks_upprev_box', 'iworks_upprev_box_mycontent' );
 
function iworks_upprev_box_mycontent( $content )
{
    $value = '<div id="upprev_box">';
    $value .= '<h6>My own title</h6>';
    $value .= '<div class="upprev_excerpt">';
    $value .= '<h5>Lorem ipsum</h5>';
    $value .= '<p>Lorem ipsum dolor sit amet, consectetur ';
    $value .= 'adipiscing elit. Vestibulum auctor neque vitae orci ';
    $value .= 'ornare et vehicula eros molestie.</p>';
    $value .= '</div>';
    $value .= sprintf(
        '<a id="upprev_close" href="#" rel="close">%s</a>',
        __('Close', 'upprev')
    );
    $value .= '</div>';
    return $value;
}

Get code: iworks-upprev-static-content.php.zip

Where to put this code?

There are three ways:

  1. made a one-file-plugin and put file into wp-content/plugins, then turn it on
  2. made a one-file-plugin and put file into wp-content/mu-plugins
  3. put this code into functions.php in current theme

I recommend using option 1 or 2, but 3 is the easiest.

How I can customize with my own styles?

Switch settings to Advance and go to ‘Other‘ tab to fill “Custom CSS” field.

Example:

/* header */
#upprev_box h6 a
{
    color: red;
}
/* header link: mouse over */
#upprev_box h6 a:hover
{
    color: black;
}
/* headera link: visited */
#upprev_box h6 a:visited
{
    color: gray;
}
/* container for title, thumbnail and excerpt */
#upprev_box .upprev_excerpt
{
    font-size: 8px;
}
/* excerpt */
#upprev_box .upprev_excerpt p
{
    line-height: 1em;
}
/* previous post link */
#upprev_box .upprev_excerpt p a
{
    text-transform: uppercase;
}
/* previous post link: mouse over */
#upprev_box .upprev_excerpt p a:hover
{
    text-decoration: underline;
}
/* previous post link: visited */
#upprev_box .upprev_excerpt p a:visited
{
    color: gray;
}
/* thumbnail image */
#upprev_box .upprev_thumb
{
    padding: 1px;
    border: 1px dotted red;
}
/* close button */
#upprev_close
{
    opacity: .7;
}

How to change post thumbnail to other image?

Use the iworks_upprev_get_the_post_thumbnail filter:

<?php
add_filter( 'iworks_upprev_get_the_post_thumbnail' , 'change_thumbnail' );
function change_thumbnail( $image )
{
    return '<img src="image.png" alt="" />';
}

Read more: Filter Reference / iworks upprev get the post thumbnail

Where to put this code?

There are three ways:

  1. made a one-file-plugin and put file into wp-content/plugins, then turn it on
  2. made a one-file-plugin and put file into wp-content/mu-plugins
  3. put this code into functions.php in current theme

I recommend using option 1 or 2, but 3 is the easiest.

How to add default image to post without thumbnail?

Use the iworks_upprev_image action:

<?php
add_action( 'iworks_upprev_image' , 'default_image' );
function default_image()
{
    return '<img src="image.png" alt="" />';
}

Where to put this code?

There are three ways:

  1. made a one-file-plugin and put file into wp-content/plugins, then turn it on
  2. made a one-file-plugin and put file into wp-content/mu-plugins
  3. put this code into functions.php in current theme

I recommend using option 1 or 2, but 3 is the easiest.