MatrixAdapt | Logiciel de gestion d'Entreprise, Création et référencement des sites web

Seo Master present to you:
2013, By: Seo Master

Seo Master present to you: The navigation links are those that appear at the bottom of the page that says "Older Posts", "Newer Posts" and "Home" and help us to move through the blog posts. This tutorial will show you how to change the word "Older Posts" and "Newer Posts" for post titles and make these to appear in a box "fading" when you scroll down the page.

You can see it in action on this demo blog - when you scroll down, the navigation links will appear showing the post titles for the older/newer entries.

This way to display the navigation links will be seen only in individual entries, while those on the homepage and other parts of the blog will still be displayed as usual.

How to Add Navigation Box with Newer & Older Posts on Blogger

Step 1. From your Blogger Dashboard, go to Template > Edit HTML, click anywhere inside the code area and search - using CTRL + F - for this line:

<b:include name='nextprev'/>

Screenshot:

Step 2. REPLACE the code above with this one:

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:include name='nextprev'/>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='blog-pager-box'>
<h4>Other posts published:</h4>
<b:include name='nextprev'/>
</div>
</b:if>

Note: you can change the "Other posts published" title with your own

Step 3. Now add just above </head> the following code:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>
<script>
// <![CDATA[
$(function() {
$('#blog-pager-box').toggle()
.css({
width: '520px',
height: '150px',
position: 'fixed',
padding: '1em',
bottom: 0,
right: 0,
background: 'url(http://www.matrixar.com/-2qUvFgMRqk4/UaD7GSA7C8I/AAAAAAAADbI/eh-qGOnAmeM/s1600/paper.jpg)'
});

$(window).scroll(function() {
if($(this).scrollTop() > 100) {
$('#blog-pager-box').fadeIn();
} else {
$('#blog-pager-box').fadeOut();
}
});
});
$(document).ready(function(){
var newerLink = $("a.blog-pager-newer-link").attr("href");
$("a.blog-pager-newer-link").load(newerLink+" .post-title:first", function() {
var newerLinkTitle = $("a.blog-pager-newer-link:first").text();
$(".blog-pager-newer-link").html("<div>Newer Posts:</div>" + newerLinkTitle);
});
var olderLink = $("a.blog-pager-older-link").attr("href");
$("a.blog-pager-older-link").load(olderLink+" .post-title:first", function() {
var olderLinkTitle = $("a.blog-pager-older-link").text();
$(".blog-pager-older-link").html("<div>Older Posts:</div>" + olderLinkTitle);
});
});
// ]]>
</script>

<style type='text/css'>
<!--
#blog-pager-box {
box-shadow: 0 0 3px #AEAEAE;
z-index:9;
}

#blog-pager-box h4 {
margin:0;
padding:0;
color:#4898B9; /* Widget's title color */
font-size:16px; /* Title font size */
}

#blog-pager-newer-link {float:left;clear:both;line-height:30px;}
#blog-pager-older-link {float:left;clear:both;line-height:30px;}
.home-link {display:none;}
.blog-pager-older-link, .blog-pager-newer-link {
background-color: transparent !important;
background-image: none !important;
border:0 !important;
color: #4B4B4B !important; /* Color of the links */
float: left;
width: 500px;
clear:both;
}

a.blog-pager-older-link:hover, a.blog-pager-newer-link:hover {
text-decoration:none !important;
}
 
a.blog-pager-newer-link:before {
content: url(http://www.matrixar.com/-2hKXB7FANlI/UaD_wh_InyI/AAAAAAAADbs/S0H4hok2te0/s1600/back.png);
float:left;
}
a.blog-pager-older-link:before {
content: url(http://www.matrixar.com/-VPxzgLQCgrM/UaD_tGXPfnI/AAAAAAAADbk/owLQci4BaYY/s1600/forward.png);
float:left;
}
#blog-pager {
width:500px;
background-color: transparent !important;
background-image: none !important;
border:0 !important;
text-align:left;
}
 
#blog-pager div {
color:#0577AB; /* Color for the "Newer Posts" and "Older Posts" text */
font-weight:bold;
margin-bottom: -5px;
}
a#blog-pager div:hover {
text-decoration:none !important;
color:#4898B9; /* Color for the "Newer Posts" and "Older Posts" text */
}
-->
</style>
</b:if>

Note that this gadget uses jQuery, so try to have only one version.

Customization:

- There are three URLs in blue, the first is the paper background image for the box, the other two are the icons that correspond to the arrows. You can replace these with your own.
- In green you can see where to change the text colors.
- The red number is the distance in pixels that activates the gadget, this means that the box will appear when you scroll down the 100px. You can use a higher value if your posts are usually long and therefore the "height" of the scroll is greater.

Step 4. Now, Save the Template and that's it!

You can also change the "Older Posts" and "Newer Posts" links with posts titles or images. 2013, By: Seo Master

Seo Master present to you: Posted by Dion Almaer, Google Developer Programs

A lot of the product teams are heads-down for Google Developer Day, which is only a matter of days away! Ed Burnette interviewed Bret Taylor, Group Product Manager, and the interview will give you a glimpse of what is to come at Developer Day.

Although the engineers and teams are hard at work preparing for Developer Day, there was still a lot of news surrounding developer APIs and products.

In API and developer-product news...

Cool Ajax Feeds and Maps Mashup

Chris Schalk has created a mashup using the AJAX Feed and Google Maps APIs. The mashup allows you to find photos in Flickr, and have them plotted on a map, thanks to georss. This is a nice example to View Source to get more of a feel for the APIs and how you can use them as building blocks to work with each other.

Generate dode from your WADL REST API descriptions with REST Describe & Compile

Thomas Steiner has released a new version of his REST Describe and Compile tool. The tool is capable of creating, editing, and describing services using the new WADL format. The current tool will generate PHP code to access your REST APIs (more languages coming), and is created with the Google Web Toolkit.

LightboxImage GWT

Everyone loves a lightbox. If you hunt around the Web you will find lightboxes, thickboxes, thinboxes, and all other boxen. This GWT component wraps the original lightbox so that you can create modular image inline popups without having to touch the JavaScript beneath.

New GData Developer Guides - Spreadsheets and Blogger

Jeff Scudder has updated the Blogger and Spreadsheet API developer guides to show you how to speak to the services in .NET and Python, to add to Java and raw HTTP examples. This is part of an on going effort to beef up the documentation. Recently you may have noticed that the Calendar docs have also been improved, and much more is coming.

Around Google

There was some other interesting news that I thought I would highlight. Pamela Saenger announced the release of a new feature on Google Translate that lets you search content in languages that you do not know, and get results back in your language. That takes some time to sync in. Imagine if you were a wine buff and you wanted to find out more about a particular French wine. You could use this feature to search the French websites, returning content in English.

I use Gmail for Mobile, Google Maps, Google Reader, and other Google products on my mobile phone. Now I can add Google Calendar to the list. If you visit calendar.google.com on your phone you will see a slim agenda view of your upcoming events.

What's hot today? was the question that the team that merged Google Trends with Google Zeitgeist to create Hot Trends. There are many PhD theses to be had by trying to understand why some of these make the list, and it definitely is able to show all sides of humanity.

Conferences

Besides Google Developer Day, there are some other conferences that have been mentioned:

The Google Test Automation Conference in New York City on August 23-24, has finalized the speaker list and has opened up for free, limited attendance.

Our Conference on Scalability has also opened up for registration until June 15th. They have nine great talks from industry and academia including keynotes by Jeff Dean and Marissa Mayer from Google and Werner Vogels from Amazon, and the event is taking place in Seattle on June 23rd.

Featured Projects

QueWeb Customer Care

Queplix has open sourced a web-based customer-care application that uses GWT to create a rich, desktop-like experience.

Rolling Stone AJAX Search

Rolling Stone has a nice customized use of the Google AJAX Search API that builds on top of the base GSearchers and gives results that make sense in this domain. For example, the results are split up by artist, news, album reviews, and more. This is a nice example to see how you can take the core of AJAX Search and tweak it a little bit to get what you need. This one-liner says a lot:

searcher.execute("intitle:" + query + " site:rollingstone.com/artists " +
   "-inurl:articles -inurl:photos -inurl:albums -inurl:videos " +
   "-inurl:biography -inurl:reviews -inurl:discography");

Google Tech Talks

Groovy Things To Do With Groovy

Guillaume Laforge came to Google to discuss the Groovy programming language, and came prepared with nice examples of using Groovy to access Google properties and use some of the Google APIs. If you would like an agile language on top of the JVM, check this out.

Advanced Topics in Programming Languages Series: C++ Threads

Lawrence Crowl came to discuss how the next C++ standard will provide direct support for threads, including a model of memory, atomics, variables, launching, scheduling, synchronization, and termination.

Podcasts

Google Summer of Code Podcast: Episode 2 - The Umit Project

For our second podcast, we had a chance to catch up with Adriano about life as a Summer of Coder, as well as Umit and other free software in Brazil.

Thanks for taking the time to keep up to date with our news. We look forward to seeing some of you at Google Developer Day. Keep tuning for an interesting week coming up!2013, By: Seo Master