WordPress › Support » [Plugin: upPrev: NYTimes Style "Next Post" Animated Button] Percentage of post and not who

bhagwad
Member
Posted 1 year ago #

First of all, this is a brilliant plugin. Works perfectly.

This is just a suggestion.

It might be more useful if the offset is a percentage of the actual post instead of the whole page excluding the comments.

When there are dozens and dozens of comments, the animation doesn't appear till we're almost halfway down the comment list - which isn't what might be best. Setting the offset to a much smaller number however, leads to the animation displaying too early on posts where there are no comments.

http://wordpress.org/extend/plugins/upprev-nytimes-style-next-post-jquery-animated-fly-in-button/
bhagwad
Member
Posted 1 year ago #

Thanks for adding an option to display before a certain element!

But the "display before HTML element doesn't seem to be working for me. Any other instructions I might be missing? It doesn't display at all when I select the checkbox.

Still works great without it though :)
ifikra
Member
Posted 1 year ago #

great plugin, many thanks. There is a small issue when checking the box and css elements "#comments". The animated button does not appear on all post that do not have comments then.
fr33think3r
Member
Posted 1 year ago #

@bhagwad, i noticed that bug too and wrote about it here: http://wordpress.org/support/topic/plugin-upprev-nytimes-style-next-post-animated-button-tiniest-of-bug-in-the-plugin?replies=1

A very simple change to get things working :)
Grzegorz Krzyminski
Member
Posted 1 year ago #

Thanks fr33think3r for pointing this.

1.3.3 should have a fix to resolve both issues mentioned here.
fr33think3r
Member
Posted 1 year ago #

Thanks Grzegorz for the release.

Any chance you could fix the custom post types issue too? I think it should be as simple as passing post_type = 'any' to get_posts on Line 25 in upprev.php.
Grzegorz Krzyminski
Member
Posted 1 year ago #
Thanks for the suggestion fr33think3r.

I'm not sure.. have you tried it?

By the first glance I have impression it will be something different. Currently upPrev suggestions are based on categories. It displays the previous post from the categories where the current post belongs to.

If I'm not wrong custom posts aren't categorized. There will rather a need to change all part related to the foreach loop which is only checking the order of post in post's categories and instead of this add some conditional statement, something like: get all posts, where the post_type = current_post_type, order by date desc (completely forgetting about categories).

Another questions is:
- what does get_adjacent_post() return... isn't it null... it was based on categories also here (I guess this is the reason why the upPrev is not showing up at the custom post type pages)
It's high possible that I'm trying to see things much more complicated that they are.

If only find a little free time I'm going to work on this.

fr33think3r
Member
Posted 1 year ago #

I'm not sure.. have you tried it?

Just tried it, here's the code that works for me, I can see my custom post types now :)

foreach((get_the_category()) as $category) {
            $args = array(
              'post_type' => 'any',
              'category' => $category->cat_ID,
            );
            $posts = get_posts($args);
            foreach($posts as $post){
                if (!in_array($post->ID, $all_posts)) {
                    $all_posts[] = $post->ID;
                    $all_posts_str .= $post->ID . ' ';
                }
            }
        }
        $all_posts_str = trim($all_posts_str);
        $posts_desc_args = array(
                              'post_type' => 'any',
                              'include' => $all_posts_str,
                              'orderby' => 'date',
                              'order' => 'DESC',
                            );
        $posts_desc = get_posts($posts_desc_args);

If I'm not wrong custom posts aren't categorized.

By default, yes they are not categorized, but adding categories to custom post types is easy, and I'm pretty sure a lot of people do that. For eg. On my blog http://www.humbug.in, the main page shows list of normal 'post' type while http://www.humbug.in/mblog/ shows a list of posts of a custom post type. You will see that all the custom post types are tagged and categorized.

Hope this helps.

fr33think3r
Member
Posted 1 year ago #

You might also want to set 'numberposts' => -1. Coz the count of the articles in the category is incorrect otherwise, it will always show 5 because get_posts gets 5 posts by default.

Its just that that will be highly inefficient. There's a sample code to count the number of posts in a category here.

http://www.bestwpthemez.com/wordpress/code-to-count-total-number-of-post-for-a-category-in-wordpress-blog-1645/

May be you could use that.
Lucker
Member
Posted 1 year ago #

Thanks a tons for awesome plugin! It's exactly what I've searched.

But it would be a killer plugin if it have some customization in backend. Actually I's thinking about Similar Post plugin integration. But it would be nice at least simply to put in the particular post, without categories.
Lucker
Member
Posted 1 year ago #

One question: how to customize:
1. Article link - I'd like it'd be the same as the post titles in my blog (now it the same as my footer)
2. category link - I'd like it would be lighter color than "More in " category color.
Unfortunately I can't do this with the current CSS (or maybe my skiil not enough...).

Could you please advise how to change css settings for particular elements of the flyout window?
Grzegorz Krzyminski
Member
Posted 1 year ago #
Hello Lucker,

About customization. Try to use css selectors like these:
1. #upprev_box > a {} /* Article link */
2. #upprev_box h6 a {} /* Category link */
Lucker
Member
Posted 1 year ago #

Hello Gregorz,

Thank you for instuctions, but it didn't help. Selector a doesn't work for me. The values of the selectors appear strikeout in Firebug.

For instance, this cod is strikeout:
#upprev_box > a {
color:#A60000;
font-family:verdana,arial,sans-serif;
font-size:1.2em;
font-weight:500;
letter-spacing:-1.5px;
}
upprev_flyout.css #2 (строка 1)
a:link, a:visited, a:active {
color:#A60000;
font-weight:normal;
text-decoration:none;

It take css from footer, as I understand.
Grzegorz Krzyminski
Member
Posted 1 year ago #
I understand you put this code inside upprev_flyout.css and you are using the flyout effect (not a fadeIn/Out)

About Firebug and proposed selector... For example: E > F Matches any F element that is a child of an element E. This is declared in that way to make sure that the selector is related only to the Article Link. Another way selector like this one #upprev_box a {} would be related to both Article and Category Link.

As far as I know child selector E > F is not compatible only with some older browsers like IE6.

To make this compatible with all browsers, use the below example:
- #upprev_box a {} /*#upprev_box a:link, #upprev_box a:visited, etc... */
- #upprev_box h6 a {}
Make sure two use the second selector also, another way the Category Link is going to look exactly the same like Article link.

After uploading changes make sure to delete temporary Internet files, another way the browsers may still using the previous cached version of stylesheet. For Firefox you can simply press Ctrl+Shift+R

If there is still some problem with it, could you provide a link to your website?

Lucker
Member
Posted 1 year ago #

Thanks for your efforts to teach me CSS, but I guess I'm horizonless for it. Yes, you are right, I'm using flyout effect and put the selectors in the one's css sheet.

Couldn't agree more with you about E & F logic. It seems impeccable for me even I'm absolutely newbie with css. But I didn't reach the "test with IE6" stage - it doesn't work with Firefox (even with cleared cache).
After you detailed explanation I put in the flyout css style sheet the next code:

#upprev_box {
    position: fixed;
    z-index: 1000;
    bottom: 0px;
    right: -400px;
    width: 360px;
    padding: 10px 20px 10px 10px;
    border-top: 2px solid #000;
    border-left: 1px solid #f0f0f0;
    background-color: #fff;
    -moz-box-shadow: 0 4px 10px #666;
    -webkit-box-shadow: 0 4px 10px #666;
    box-shadow: 0 4px 10px #666;
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Color=#cccccc, direction=270, strength=7)";
    filter: progid:DXImageTransform.Microsoft.Shadow(Color=#cccccc, direction=270, strength=7);
    _position: absolute;
    _top: 0;
}

#upprev_box h6 {
    margin: 0 0 5px 0;
    padding: 0;
    text-transform: uppercase;
    font: bold 10px arial,helvetica,sans-serif;
}

#upprev_box h6 a {
    font-family: verdana, arial, sans-serif;
    color: #111111;
}

#upprev_box a {
    font-family: verdana, arial, sans-serif;
    font-size: 1.2em;
    font-weight: 500;
    letter-spacing:-1.5px;
    color: #A60000;
}

#upprev_box .num {
    color: #888;
    font-weight: normal;
}

#upprev_box button {
    border: none;
    padding: 0;
    position: absolute;
    top: 5px;
    right: 5px;
    width: 13px;
    height: 13px;
    background: #fff url('close_window.gif') no-repeat 0 0;
    text-indent: -999em;
    overflow: hidden;
    cursor: pointer;
}

It have changed the size of the "More in" (make it little bit smaller) and size of article link (Make it bigger, another font and larger letter-spacing). That's all. Nothing more.

I guess I should add one more notice. When I tried to change css the first time and put the code into the #upprev_box {} selector it changed "More in" and "# of # articles" appearance. Another text and links didn't change.

My website contain posts (where plugin appears) only in Russian, but design has no language barriers, I guess.

Grzegorz Krzyminski
Member
Posted 1 year ago #
OK, here is the solution. Try to use following selectors:
```
#footer #upprev_box h6 a {
    font-family: verdana, arial, sans-serif;
    color: #111111 !important;
}
#footer #upprev_box a {
    font-family: verdana, arial, sans-serif;
    font-size: 1.2em;
    font-weight: 500;
    letter-spacing: -1.5px;
    color: #A60000 !important;
}
```
Currently there are some internal styles with your theme with some selectors like #footer a:link {}, which were overwriting styles from an external file. Adding additional #footer to selectors defined at upprev_flyout.css is enough. To be completely sure you can also use an !important rule, which can be added to every property. (!important rule prevent overwriting specified property by other selectors)

Here is a preview: http://gkrzyminski.pl/shershidsky/2010/09/pyat-oshibok-primeneniya-sbalansirovannoj-sistemy-pokazatelej.html
Lucker
Member
Posted 1 year ago #

Gregorz, thanks a tons, it works just fine now. I can really customize the flyout (as well fade) button as I wish.

My theme is Atahualpa - very customizable theme for dummies like me. I think it's very popular 'cause it allow construct wordpress blog with tiny knowledge of html. Also it has great support.

Anyway, Gregorz, thank you again and good luck.

Cheers
duncmorley
Member
Posted 1 year ago #

I can't get this to work with my custom theme. When i switch back to the Twenty Ten theme it works OK. Any ideas as to what may be stopping it from working? Is there anything I should have on my template to make it work?
Grzegorz Krzyminski
Member
Posted 1 year ago #

Hello duncmorley,

Could you provide an address of your website?
duncmorley
Member
Posted 1 year ago #

http://blog.pauleycreative.co.uk

The element selector is .comments-template
Grzegorz Krzyminski
Member
Posted 1 year ago #

Try to replace the original plugin's file with this one:

http://gkrzyminski.pl/helpdesk/upprev.php_ (remove underscore after downloading)

The file should copied under: wp-content/plugins/upprev.../
duncmorley
Member
Posted 1 year ago #

Thanks for taking time out to do this. Having uploaded your new file to the requested directory it is still not working.
Grzegorz Krzyminski
Member
Posted 1 year ago #

I'm wondering about something - is it possible to download this theme from somewhere, or this a custom theme created only for you?

I'm asking about that, because it would be the easiest for me to test it with a working theme than just guessing and sending another file.
duncmorley
Member
Posted 1 year ago #

It's an old theme we have created. A new one will be implimented soon so I'll leave it until we use our new one and let you know if it works with that one.
duncmorley
Member
Posted 1 year ago #

I now have this working. I had forgot to include the following snippet in my footer:

<?php wp_footer(); ?>

You need this for the plugin not to break :)
Boo Boo
Member
Posted 1 year ago #

Hello Grzegorz. Will your plugin work on pages and not posts? I want to put it on some key pages of my site and be able to put in a link for the user to click on another page. Any help would be appreciated.
danielkilian
Member
Posted 1 year ago #

@Grzegorz

Hi Grzegorz,

i just installed the plugin. unfortunately it doesnt work on my blog.

my url: http://danielkilian.com

could you pls check out the reason. hopefully there is a way to fix it.

thank you in advance.

br
Daniel
Grzegorz Krzyminski
Member
Posted 1 year ago #

Hello danielkilian,

I have impression that it can be exactly the same issue which duncmorley had previously.

I had forgot to include the following snippet in my footer:
<?php wp_footer(); ?>

You need to check your theme file related to footer and find is there a mentioned code.

danielkilian
Member
Posted 1 year ago #

Hmm,

just checked my footer. looks like that this is in. could you pls check it too? here you can see my footer code:

<div class="fix"></div>

</div> <!--/#page .container_16-->

<div id="footer">

	<div class="container_16">
        <div class="grid_16">
            <p class="fl">© <?php echo date('Y'); ?> <?php bloginfo(); ?> | <?php _e('Powered by',woothemes); ?> <a href="#">WordPress</a> | </p>
            <p class="fl"><a href="http://danielkilian.com/impressum">Impressum</a>
            <p class="fr"><a href="http://www.woothemes.com/amember/go.php?r=39927&i=b16">Fresh News Theme</a> <?php _e('by',woothemes); ?> <a href="http://www.woothemes.com/amember/go.php?r=39927&i=b16" title="WooThemes - Premium WordPress Themes"><img src="<?php bloginfo('template_directory'); ?>/images/woothemes.png" alt="WooThemes - Premium WordPress Themes" /></a></p>
        </div>
	</div> <!-- end .container_16-->

</div>

</div> <!-- end #background -->

<?php wp_footer(); ?>

<?php $twitter = get_option("widget_twitterwidget"); ?>
<?php if ( $twitter['username'] ) { ?>
<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
<script type="text/javascript" src="http://twitter.com/statuses/user_timeline/<?php echo $twitter['username']; ?>.json?callback=twitterCallback2&count=<?php echo $twitter['number']; ?>"></script>
<?php } ?>

</body>
</html>

Topic Closed

This topic has been closed to new replies.

WordPress.org

Forums

upPrev Previous Post Animated Notification
Percentage of post and not who (29 posts)

Topic Closed

About this Plugin

About this Topic

Tags

Code is Poetry

WordPress.org

Forums

upPrev Previous Post Animated Notification Percentage of post and not who (29 posts)

Topic Closed

About this Plugin

About this Topic

Tags

Code is Poetry

upPrev Previous Post Animated Notification
Percentage of post and not who (29 posts)