Affichage des articles dont le libellé est Search. Afficher tous les articles
Affichage des articles dont le libellé est Search. Afficher tous les articles

How To Enable Search Description Option If Its Not Available In Blogger Post

How To Enable Search Description Option If Its Not Available In Blogger Post



How to fix Blogger search description not showing when shared

Blogger Meta Search Description Not Showing In Post When Shared/publish

When using a search engine (such as Google.com), you probably see a blurb of text underneath your search results that helps you decide whether or not that’s the site you want. For example: This is what appears when you search for “Blogger.”



The descriptive line of text that appears under the link is the search description.
If you don't specify a search description for your blog, search engines will establish one for you based on your blog’s content.
To create your own search description, just go to Settings | Search Preferences and click Edit next to "Description" to reveal a text field. Select Yes, write in your text, and click Save changes.


A few examples of blog search descriptions:
  • “A blog about social networking and web design.”
  • “A journal of my year in Paris.”
  • “Healthy southern-style cooking.”
Enabling this feature will display a “Search Description” option in the Post Settings panel that allows you to enter a search description for individual posts.

Search Description option Showing Perfectly under blogger post

Enjoy.........

Show 5 Star Rating In Google Search For Blogger Each Post

Add 5 Start Rating In Blogger Post For Google Search
Add Five Star Blogger Post/website Link In Google Search

Hello Bloggiyan TGoogle Star Rating is the rating for website which is shown in search engine results for the particular link of the concerned website. This rating is shown as stars and is displayed in search results, below the URL. The star rating is based on visitor responses on the content of your website/blog for which the rating is shown.
 

How To Display 5 Start Rating for Blogger In Google Search

Installing review markup in WordPress Blog is extremely straightforward then installing it in Blogger, because there are numerous Plugins available which makes everything possible in WordPress. However, blogger don’t have robust plugins so here we will take help of chunk of HTML coding that will work as perfect as the Plugins available in WordPress.
  • Step#1: Go To Blogger.com >> Add a Post >> HTML Tab
  • Step#2:  Then copy and paste the following HTML code in HTML tab of Blogger post editor.
  fn">Name of Product Which You Are Going to Review
 
Last Reviewed by Reviewer's Nameon June 06 20132013-10-06" class="value-title">
 
 Rating: Stars

Edit the highlighted values with your own values as mentioned below:
  • Write the name of product by replacing "Name of Product Which You Are Going to Review". For example if you are reviewing a Nokia N8 phone, then write Nokia N8 in place of the yellow highlighted text
  • Next comes the reviewer's name. Here you can write your own name or any name which you like to make appear in search results as reviewer. Replace highlighted "Reviewer's Name" to customize it
  • In third step, customize the date which you want to show as on which the the review was made. Replace the date in "2012-18-10" as YYYY-DD-MM format
  • At last, edit your rating to the concerned post/product. Replace "Stars" with the number of stars which you would like to make appear in results. Remember that your value should be between 1-5.
  • You are all done. Save your webpage in case of a website page or publish your post if you are adding this to a Blogger blog's post. Wait for Google to index your post/webpage. Once it is indexed, you can see the stars in search results
You can check either the markup is added properly or not with the help of Google's Rich Snippets Testing Tool. If the markup is not added properly, then you need to fix it before the ratings are shown in search results. You can use a cool WordPress plugin from GD Star Ratings to show the ratings in search results and at the bottom of posts easily. This plugin provides many more features and customizations also.
This was all about Your Post/Website Rating stars appearance in Google search results. I hope you liked it. If you face any difficulty regarding this, you can ask by commenting on this post. Thank you!

Post Your Comments And Ideas 
Show 5 Star Rating In Google Search For Blogger Each Post - Simple Installation
Last Reviewed by S2Free Blog Team on June 10 2013
Rating: 4.5

Click On Expend WordPress Style Search Widget For Blogger

Click On Expend Bar WordPress Style Search Widget For Blogger

If You Like Expended Search Box WordPress Styles, We Found It For Your Blog.  

Many People WordPress so much but the things i like in WordPress are there style.They are using Css and html in perfect way by which user don't need to edit there blog so much.
Today I am gonna share with you how to add good looking hover effect css search box into blogger.

Step To Add  WordPress Style Search Widget In Blogger

  • Go to blogger dashboard.
  • Click on layout button.
  • Now there Add Gadget.
  • Select html/Javascript and paste following code there.
 


Save Done
WoW its just Added Under 60 Seconds Check Your Blog Now..

Metro UI Style Flipping Social Media Widget With Search Box For Blogger


Metro UI Style Flipping Social Media Widget With Search Box For Blogger


HI Bloggiyan! We always looking to provide easy & stylish widget for blog lover. Today we are sharing Metro UI Style Social Media widget with search option . Icons flipping style will attract your visitor & maximum possibility to join your network as showing in Facebook, Twitter, Google plus ,Pintrest  and Rss Feed. Above is animated preview. we always try to show you animated demo instead of real published demo to save your time . 

You can use this widget in blogger sidebar, footer , header or any where with just copy paste code .

How To Add Flipping Style Social Media Widget in Blogger.

 1. Log in to blogger account and Click drop down. 
2. Now select "Layout" Like Below.
3. Click Add Gadget and select 'HTML/JavaScript
4. Paste below one of below code.  



Connect With Us






Customization:

Replace s2freeblog with your twitter profile
Replace
s2freeblog with your facebook profile
Replace
s2freeblog with your feedburner profile
Replace
s2freeblog with your pinterest  Username
Replace UserId with your Google Plus User Id

5. Now save your HTML/Javascript'.
    You are done...  

How to Change the Title Tags in Blogger for More Search Engine Traffic

How to Change the Title Tags in Blogger for More Search Engine Traffic



By default Blogger displays the blog title first, followed by the name of the post. As you might notice this is not good when it comes to SEO. It's important for the name of the post to come before the name of your blog, especially when it comes to google search results. Learn how to make your post title show up first so that you can reel in more traffic from the search engines.

Why Change the Titles?

It's quite important to have the Post Title + Blog Title arranged accordingly because this is how you would want your blog to be displayed on google's search results. This way more people will click on your link when searching google because the post title is more relevant than your post name.
Example Google Search Results:
You are most likely to click on the bottom image when searching google for the keywords "image reflection generator". The reason being is that your mind reads text from left to right. So it makes sense to have the more important title on the left.

How to Change the Titles:

  • Go to Layout>edit HTML in your Blogger dashboard.
  • Search for this tag: <data:blog.pageTitle/>
  • Replace this tag with the following code:
<data:blog.title/> <data:blog.pageName/> | <data:blog.title/>
Save your template and you should see the results in your web browser as depicted in the images below.
It may take a few days for the changes to show up on the google search results. I guarantee you that you will start receiving more traffic from google once you are re-indexed!

Blogger Meta Search Description Not Showing When Shared


Blogger Meta Search Description Not Showing When Shared

How to fix Blogger search description not showing when shared
Blogger Search Description
If your Blogger search description snippet for anyone of your post is not showing when shared with the likes of Twitter, Facebook, Google+ or any other social network, then this is how to fix it:

Go to Template > Edit HTML

Blogger template edit HTML
Template Edit HTML
Expand Widget Templates, press Ctrl f and search for
Just above it insert code
Job Done...

How To Connect Two Pages To Use Google Search Box?

How To Connect Two Pages To Use Google Search Box?





create Google Search box Google custom search engine for websites and blogs is another way to provide easy navigation to your visitors and readers as well as make some extra cash out of Adsense. Its best advantage is that it will help Google to index your pages quickly. All those pages which are indexed by this search box function is automatically indexed by robots and added to Google's databases.  Its not just about Making money but about deep indexing and site navigation. After the introduction of Plus project, Google developers have transformed all services to look like Google Plus. They recently introduced a search box which looks exactly like Google's official search box. You can see it towards to top right corner of our site. If you insert a query inside the box and hit enter you will land on a different page where results are displayed.





We have dedicated a whole new page for search results in order to provide users with more flexibility. You may also notice that as soon as the search page loads, the search box at the top-right disappears and instead you see one inside the middle of the page. In order to connect two pages in blogger you will have to follow this easy tutorial.







 Note before you may start you must learn how to create a custom search box and how to integrate AdSense into it. We have already published detailed tutorials on it which you may follow below:


Google Custom Search Engine Series

Part1: How to Create a Google Search box?
Note: Follow this part only to create the box, stop where it tells you how to add it to blogger. We will learn how to add it by connecting two pages in today's tutorial.


Part3: Customize the Fonts and Colors of the search box
Note:-
You wont require reading this part if you want to use the latest Blue Look that the tutorial today shares.

Part3: How To Connect Two Pages To Use the Google Search Box?


Choosing the style

We assume that you have read Part1 above and you are ready to choose the GooglePlus style box.


  1. Go To http://www.google.com/cse/manage/all

  2. Click the control panel link next to your search box title

  3. From the left menu choose "Look and Feel"

  4. For layout choose "Two Page"

  5. For Style choose "New! Default"  If you wish to customize the link colors on the search results page, click the customize button to make the changes
create google search box
    6.  Click Save & Get code
    7.   Now do not close the window and open a a new tab and do this:


  • Go to blogger

  • Click Pages form list menu

  • Create a new page and title it "SEARCH RESULTS"

  • Write nothing inside it and click Publish

  • Now visit this new page and copy its URL from browser address bar

  • Done!
    8.    Now go back to the first window where you have the code for the search box.
    9.    Where it asks for Specify search results details paste inside the first box the URL of the SEARCH RESULTS page you just created. See the screenshot below for our page
search results details
Inside the second box where you are asked to specify the query parameter embedded in the URL of search results, you can keep it default or you can simply replace the letter "q" with your blog short name. If you search anything on our blog you will see MBT parameter appearing in the URL inside the address bar as shown below:
query parameter
   10.  After you have filled the two boxes click "Save Changes"
   11. You will see two big boxes containing a code. Copy the code from first box which says "Paste this code in the page where you'd like the search box to appear. "  And Paste it inside a HTML/JavaScript widget and drag this widget to your blog layout's top-right position as shown below:
. position search box
Note: In the above step we created a HTML/JavaScript widget by going to blogger > Layout > Add a Gadget and then chose HTML/JavaScript widget.
    12.  Now after you have positioned the search box the only part left is adding the second code inside your SEARCH RESULTS page. To do this copy the second code from the box which says "Paste this code on URL of Your SEARCH RESULTS Page, where you'd like the search results to appear".
Now go to your SEARCH RESULTS page inside blogger and paste the code inside the HTML section of the editor as shown below:
search results page
    13.  Hit update and you are all done!
Visit your blogs to see a million dollar worth search box right on your sidebar. Play with it to see how search results appear. :)

Hide the Search box and Social Networking Buttons


Your Page might also be displaying social networking buttons and Adsense Ad below title. In order to clean up the search page you must hide them and also hide the search box in the sidebar so that visitor may not see two box on one page. To hide widgets kindly read our detailed tutorial on controlling the widget display in blogger:

______________________________________________________

How To Create Google Custom Search Engine ?

How To Create Google Custom Search Engine ?

 Google-Custom-Search-EngineWhen it comes to crawling the internet or a website nothing can surely beat Google's searching technique. Blogger Templates that are found in various designs and colours often have custom search boxes in it, which I am sure you might have observed are incapable of displaying the relevant results. These search boxes by default are limited to their ability of searching each and every word of your blog. The best solution is to use Google Custom Search Engines (CSE) that are extremely efficient in digging out the most important data from your blog and displays it to the visitor. This increases the number of pageviews and page impressions of your blog because the reader is kept engaged in reading more and more. Further you can easily integrate your Google AdSense Ads to your Google Custom Search box, which again increases your blog revenue for every click made on the search results. An Example of such search engine can be found below every post of this (MBT) blog. So lets create and install a beautiful Google Search box for your blog.




How To Create a Custom Google Search Engine?

  1. Go To Google CSE
  2. Hit the create custom search engine button
  3. Fill the form as shown in the screenshot below,
set up your google search engine
   4.   The Click the next button and choose the Design for your search engine. You can click the "Customize" button to edit the colours and look.
customize-the-look-and-color
   5.  Hit the next button and then click the "Look and feel" link on the next page as shown below,
CSE-look-and-feel
It will bring you a page where you will find three layout options i.e Full -width, Compact and Two Column as shown below,
Google Search Engine Layouts
  • If you wish to add the search box just below posts as I have done on my blog then choose Full-width
  • Or if you wish to display the box and results on the sidebar then choose compact
  • Else if you wish to add your search box to your sidebar and display the search results above the post title then choose Two Column
  6.  Finally hit "save & get code" button and jump to the next part of our tutorial.

Add Google Custom Search Engine To Blog Posts

To add the search engine just below your blog posts as we have done on MBT then please follow the steps below,
customize Google Custome Search Engine
  1. Go To Blogger > Design > Edit HTML
  2. Backup your template
  3. Click the Expand Widgets Templates Box
  4. Search for
  5. Just below it paste your Blog Post Search Engine Code (Full-width)
  6. Save and you are done!
  7. View your blog to see it appearing just below posts.

Add Google Custom Search Engine To Blog Sidebar

  1. Go To Blogger > Design
  2. Choose a HTML/ JavaScript Widget
  3. Paste your Sidebar Search Engine Code (Compact or Two Column) in it
  4. Save and you are done!
  5. View your blog to see it working just fine
Changing your default search box to Google Custom Search Engine Box is an important step that you must take as early as possible. You will see the difference in your analytics the next week. In the next post as shared below you will learn to integrate your AdSense Ads to your Custom Search engine and increase your Adsense earnings.

 



How To Integrate AdSense In Google Custom Search Engine ?

How To Integrate AdSense In Google Custom Search Engine ?


EARN-MORE-WITH-ADSENSEIn our previous post we explained in detail the importance of Google custom search engine with regard to your website internal search and page views, its now time to monetize your search engine to further increase your AdSense for Search revenue. This search engine displays AdSense Ads when a visitor searches for a query at your site/blog, as shown in the screen shot below,









Google Custom Search Results
The ads when clicked or even if just viewed by the visitor will increase your Pay Per Click and Page Impressions earning. Now without wasting any further time lets now learn on how to associate your AdSense account with your Custom Search Engine account.

How to Display Ads in Google Custom Search Engine?

After you have successfully created  your custom search engine and installed it on blogger, you need to monetize it by following the simple steps below,
1) Go To Manage CSE
2) Click the Control Panel link close to the name of your search engine. In my case it is My Blogger Tricks as shown below,
Custom Search Engine
3) Then click the link Make Money at the left pane,
Make-money-with-CSE
4) The finally on the next window that appears simply click the option that says "I already have an AdSense account" and fill the simple form with your email ID, postal code and the last 5 digits of your mobile number that you submitted to AdSense while creating an account.


CSE control panel
5) Hit the Submit button and you are done!
6) Log into your Adsense Account and simply click the link that may appear at the top of your dashboard which will ask you whether or not you wish to let the Custom Search engine to access your AdSense Ads. Simply click it and enjoy the happy new earning! =)

How To Change Size, Font Family and Color Of Custom Google Search Engine

How To Change Size, Font Family and Color Of Custom Google Search Engine



Custom Search EngineGoogle Custom Search Engine is another option that Adsense provides to increase your blog revenue. I shared detailed posts on how to create a custom search engine and integrate adsense in it. However the problem with the customization and editing options that Google provides lacks complete control over the margining and padding of the search box. Today we will learn on how to change the look of the search box using our own custom styles and change the size and alignment of the box elements. It is perfectly alright to edit the stylesheet (i.e. CSS Code) of the search engine because it is just a design change and therefore it does not violate any of Adsense terms of service. So lets get going!


DEMO: You will find the Minimalist Theme of the Search box on my sidebar.

Customize Google Search Box

I assume you have already tried our tutorial on Custom Search engines and have installed the search box on your blog sidebars. If not then you may first try them.
  1. Create a Custom Google Search Box
  2. Make Money With Google Custom Search Engine
The code that Google provides you will look slightly similar to this one,
Note: You are not going to use the code shared here. It only gives you idea on how to edit your own Google code for your search engine.
Loading




The CSS code is the one enclosed between the two yellow highlighted lines. This code is responsible for the over all look of your box. To keep things simple we will be focusing only on the three coloured sections of the code and I will refer them as Purple, Orange and Green section.

If you want your search box to look exactly like mine then create a search box as instructed in our previous tutorial and choose the style as "Minimalist" Then replace the first three sections of your CSS code with the ones I shared above as purple, orange and green. That's it.
However if you wish to edit the style of your current search box then you only need to change the CSS properties which are enclosed between the curly brackets i.e. {}
Lets first understand the three sections.
  • The Purple section is responsible for the look of the box that contains the Input rectangle and search button.
  • The Orange section is responsible for look of the input box where users write query.
  • The Green section is then responsible for the look of the Search/Submit button
The purple CSS code is as follows:
.gsc-control-cse {
    font-family: Arial, sans-serif;
    border-color: #ffffff;
    background-color: #ffffff;
  }
In my case I have kept border color as white and background color as white. To Change the border and background colors simply change the hexadecimal code by using our color generator Tool. If you wish to use a background image instead and you wish to change the box height and width then you may alter the same purple code as follows.
.gsc-control-cse {
    font-family: Arial, sans-serif;
    border-color: #ffffff
;


    background: url(ADD IMAGE LINK HERE) no-repeat;
    height:25px;
    width:300px;

  }

Replace ADD IMAGE LINK HERE with image direct link and change the width and height size to suit your alignment.
The Orange CSS Code is as follows:
input.gsc-input {
    border:1px solid #c7c7c7; padding:5px 0px 4px 0px; color:#666;
  }
This will style the rectangular input box where you write query text. Now here we can introduce and change several new styles like font size, font type, text area size, text color etc. You can also set a gap between the text area and the search button using padding. You can make these alterations if you wish else you can use the code in its default form and replace your input section with this orange one. Altered code is:
input.gsc-input {
    border:1px solid #c7c7c7; padding:5px 0px 4px 0px; color:#666;

font-size:12px;
font-family:arial;
font-weight:normal;
  }

I am sure the code is easy enough to be edited. You can choose the following font families as standards: Arial, Verdana or sans-serif. Font weight turns the text thickness. You can choose normal or bold. To change to text color simply change color:#666
The padding is actually the distance between the outline of the input box (Text Area box) and the text. Keep it as default. If you wish to change it then it follows this order:
padding:Top Right Bottom Left; In my case I have set them as padding:5px 0px 4px 0px;
The Green CSS Code is as follows:
input.gsc-search-button {
    border-color: #333333;
    background-color: #333333; margin-left:1px;
  }

This code changes the look and appearance of the Search/Submit button. You can edit it as there is nothing new except the margin property.
A margin is the gap distance between the search button and Text Input Box. You can set other margins too. Altered code is here:
input.gsc-search-button {
    border-color: #333333;
    background-color: #333333; margin-left:1px;

margin-right:0px;
margin-top:0px;
margin-bottom:0px;
font-size:12px;
font-family:Arial;
font-weight:bold;

  }
Start playing with these and keep saving your widget to see the preview.

Need Help?

Try customizing your search box using the simple method shared above. If you needed any help then feel free to let me know. Do share the CSS code of your search box while asking a question. I hope this helps most of you. Peace brothers.