ΠΩΣ ΠΡΟΣΘΕΤΩ ΠΑΝΩ ΑΠΟ 3 ΣΤΗΛΕΣ ΣΤΟ ΥΠΟΣΕΛΙΔΟ

ΠΩΣ ΠΡΟΣΘΕΤΩ ΠΑΝΩ ΑΠΟ 3 ΣΤΗΛΕΣ ΣΤΟ ΥΠΟΣΕΛΙΔΟ

ΠΩΣ ΠΡΟΣΘΕΤΩ ΠΑΝΩ ΑΠΟ 3 ΣΤΗΛΕΣ ΣΤΟ ΥΠΟΣΕΛΙΔΟ ΤΟΥ BLOGGER

Το υποσέλιδο του blogger μπορεί να χωριστεί σε περισσότερες στήλες από αυτές που μας επιτρέπει ο blogger μέσα από την αυτόματη προσαρμογή του προτύπου οι οποίες είναι μία εώς τρείς. Για να το κάνουμε αυτό πάμε στην επεξεργασία του προτύπου μας και αναζητούμε με την βοήθεια των πλήκρων Ctrl+F την γραμμή <footer> Όταν την βρούμε θα δούμε λίγες γραμμές παρακάτω την εξής γραμμή κώδικα : <macro:param default='2' name='num' value='3'/>

Αυτό που έχουμε να κάνουμε είναι να αλλάξουμε τον αριθμό με το γαλάζιο χρώμα ο οποίος μπορεί να είναι από προεπιλογής (1-3) και τον κάνουμε 4 ή 5 ή 6 ή όσο είναι βολικό για την εμφάνιση μικρότερου πλάτους widgets. Μετά σώνουμε το πρότυπο και ήμαστε έτοιμοι.

http://the-best-widgets.blogspot.gr/2015/12/3.html 

ΠΩΣ ΒΑΖΩ ΠΡΟΣΘΕΤΑ ΠΕΔΙΑ GADGETS ΣΤΟ ΥΠΟΣΕΛΙΔΟ

ΠΩΣ ΒΑΖΩ ΠΡΟΣΘΕΤΑ ΠΕΔΙΑ GADGETS ΣΤΟ ΥΠΟΣΕΛΙΔΟ

ΠΩΣ ΒΑΖΩ ΠΡΟΣΘΕΤΑ ΠΕΔΙΑ GADGETS ΣΤΟ ΥΠΟΣΕΛΙΔΟ ΜΕ ΟΣΕΣ ΣΤΗΛΕΣ ΘΕΛΩ
 

Για να προσθέσουμε στο υποσέλιδο του blogger επιπλέον πεδία gadgets με διαφορετικό αριθμό στηλών το κάθε ένα πρέπει να πάμε στην επεξεργασία του προτύπου και να αναζητήσουμε την ετικέτα <footer> Μόλις την βρούμε αντιγράφουμε και επικολλούμε ακριβώς από κάτω της όποιον από τους παρακάτω κώδικες θέλετε ή και όλους μαζί αναλόγως πόσες στήλες θέλετε να έχουν τα πεδία των gadgets. Μετά από την επικόλληση σώζετε το πρότυπο, βγαίνετε από το ιστολόγιο εντελώς και μόλις ξαναμπήτε στην διάταξη του ιστολογίου θα δείτε τα νέα πεδία των gadgets που προστέθηκαν.

 

Break Posts Into Multiple Pages

How to Break Posts Into Multiple Pages In Blogger

For today's example I am going to use a four page post breakdown. You can actually break a post into as few as two or up to an unlimited number of pages.  I thought four would get the point across.

Splitting Your Header Section into two different parts

Splitting Your Header Section into two different parts in Blogger

Usually a header consist of the company logo but now a days it is used as an important place where people use to put there advertisement.Some of the Blogger templates has this feature.Commonly it is a simple container which can contain 2 widgets at one time one after the other side by side normally it consist of your logo and advertisement or etc.So please but your attention towards this tutorial carefully,don't worry its not very difficult to splitter your header but it needs your little attention because templates are differently coded but the method remains the same

Create Three Column Widget footer in Blogger

How to Create Three Column Widget footer in Blogger

Have you ever thought about having an extra space in the footer area of your website to place significant widgets like Facebook like box, twitter feeds, Google Followers gadget and more? Creating a three column widgetized footer is the perfect solution as it allows you to add widgets in your site other than just sidebar. Most of the professional blogger template developers like Themeforest, Templateism and more are already providing this feature by default in their templates. In this article, we will show you How to Create Three Column Widgets footer in Blogger.

Break your Post into Multiple Pages in Blogger

How to Break your Post into Multiple Pages in Blogger

Are you looking for ways to break your posts into pages? You might have seen some popular blogs who have broken their long post into pages in order to maintain the interest of the users and it also helps in reducing the bounce rate. Today in this article, we will show you how to break your posts into multiple pages in Blogger - Post Pagination.

Why to Break any Post into pages?

As we have already mentioned above that it is used to build the interest of readers, if your post is too long then it might make reader get bored. Secondly, it is good for search engines as well, as it helps the search engines robots to crawl the pages more effectively and easily.

Therefore, if your posts are too long then you must use post pagination or break that post. And, here today we will teach you this amazing technique to break blogger posts into multiple pages.

Divide Labels/Categories in Two Columns

Divide Blogger Labels/Categories widget into Two Columns

Previously you only have single column for Labels. It is good for few labels upto 5 to 10. But if you have more labels, say 20 - 30 then the list goes very long. How about having two or more columns for labels as shown in the image. It will take less space and looks good.

Split Post in Multiple Pages -All Code-

Split Post in Multiple Pages -All Code-




text 1 Add your first page content here text 2 Add your second page content here text 3 Add your third page content here text 4 Add your final page content here
Pages: 1 2 3 4


http://blogtimenow.com/blogging/splitting-long-blog-post-blogger/

How to split long blog post in Blogger into multiple pages

Step 1: Usually you will edit your post in compose mode, but this time you are going to do this in HTML mode. Switch to HTML editor, add the span element that you see below and add your blog content in each element respectively. From the below lines you can see that only 1^st page content is visible and the remaining 2^nd, 3^rd and 4^th pages are hidden. So the remaining pages will be visible only if the visitor navigates.

<span class="content1">

Add your first page content here

</span>

<span class="content2" style="display:none">

Add your second page content here

</span>

<span class="content3" style="display:none">

Add your third page content here

</span>

<span class="content4" style="display:none">

Add your final page content here

</span>

<p><b>Pages: <span style="color: #3d85c6;">

<a href="#" class="page1">1</a>

<a href="#" class="page2">2</a>

<a href="#" class="page3">3</a>

<a href="#" class="page4">4</a></span></b></p>

Step 3: Next to make this links to work add the following script just below the pagination links.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script style="text/javascript">

jQuery(document).ready(function(){

jQuery('.page1').click(function(){

jQuery('.content1').show();

jQuery('.content2').hide();

jQuery('.content3').hide();

jQuery('.content4').hide();

return false;

});

jQuery('.page2').click(function(){

jQuery('.content1').hide();

jQuery('.content2').show();

jQuery('.content3').hide();

jQuery('.content4').hide();

return false;

});

jQuery('.page3').click(function(){

jQuery('.content1').hide();

jQuery('.content2').hide();

jQuery('.content3').show();

jQuery('.content4').hide();

return false;

});

jQuery('.page4').click(function(){

jQuery('.content1').hide();

jQuery('.content2').hide();

jQuery('.content3').hide();

jQuery('.content4').show();

return false;

});

});

</script>

That’s it! When everything is done publish your article and view it where you will see page links below the content. Just click on the links to see how it works.

2nd Way: Divide/Break Blogger post into differernt Pages

Add the code in Post Editor

Firstly open the post editor and switch to HTML tab. By default the Compose tab is selected. After opening it paste the below code

<style>
.post-pagination {
    margin: 20px auto;
    text-align: center;
    width: 100%;
}
.button_1, .button_2, .button_3 {
    border: 2px solid #f4655f;
    font-weight: 900;
    padding: 6px 36px;
    color:#f4655f;
    transition:ease 0.69s !important;
}
.button_1:hover, .button_2:hover, .button_3:hover {
    background: none repeat scroll 0 0 #f4655f;
    color: #fff;
    text-decoration: none;
}
</style>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('.button_1').click(function(){
jQuery('.content_1').fadeIn('slow');
  jQuery('.content_2').fadeOut('fast');
jQuery('.content_3').fadeOut('fast');
jQuery(this).css('background','#F4655F');
jQuery(this).css('color','#fff');
jQuery('.button_2').css('background','#fff');
jQuery('.button_2').css('color','#F4655F');
jQuery('.button_3').css('background','#fff');
jQuery('.button_3').css('color','#F4655F');
return false;
});
jQuery('.button_2').click(function(){
jQuery('.content_1').fadeOut('fast');
  jQuery('.content_2').fadeIn('slow');
jQuery('.content_3').fadeOut('fast');
jQuery(this).css('background','#F4655F');
jQuery(this).css('color','#fff');
jQuery('.button_1').css('background','#fff');
jQuery('.button_1').css('color','#F4655F');
jQuery('.button_3').css('background','#fff');
jQuery('.button_3').css('color','#F4655F');
return false;
});
jQuery('.button_3').click(function(){
jQuery('.content_1').fadeOut('fast');
  jQuery('.content_2').fadeOut('fast');
jQuery('.content_3').fadeIn('slow');
jQuery(this).css('background','#F4655F');
jQuery(this).css('color','#fff');
jQuery('.button_1').css('background','#fff');
jQuery('.button_1').css('color','#F4655F');
jQuery('.button_2').css('background','#fff');
jQuery('.button_2').css('color','#F4655F');
return false;
});
});
</script>

<div class="content_1">

Add content here

</div>

<div class="content_2" style="display: none;">

Add content here

</div>

<div class="content_3" style="display: none;">

Add content here

</div>

<div class="post-pagination">
<a class="button_1" href="#">1</a>
<a class="button_2" href="#">2</a>
<a class="button_3" href="#">3</a>
</div>

Now replace Add content here with the text you want in the respective pages and publish the post.

Important Points to Note before you move on

·   Make sure you have the jquery plugin in your blog, if not then add the below code just below the code <head> in your template

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>

·   It is preferred that you first draft the post and at the last point add this code and make respective changes as due to changing of tabs from Compose to HTML and vice versa the code may automatically get changed.

http://blogtimenow.com/blogging/splitting-long-blog-post-blogger/
http://www.triposoft.com/paginate-long-post-blogger/

Pages: 1 2 3 4