Demo on Adding PredictAd to Blogger

Adding PredictAd to your Blog


In order to add PredictAd to your blog you will first need to add a search bar and then the PredictAd add-on. This post will display the following:

1. Integrating a search bar to your blog/website


2. Integrating PredictAd with the existing search bar on your blog/website
   

Adding Google Search to your Blog

PredictAd itself doesn't search the content of your site (we leave this action to the Googles, Yahoos and Asks of the world), but rather PredictAd learns the community search patterns and displays results accordingly. As such, this post will demonstrate how to add a Google search bar to your site, and only then we will entail adding PredictAd. If you already have a search function on your blog/site than you can skip directly to the part about adding PredictAd to your existing search box.

1. Click on "Template" tab


2. You will arrive on a page that allows you to "Add and Arrange Page Elements"


3. Click on "Add a Page Element" on right-hand side (we recommend adding the search function at the top right so that it is noticeable)


4. "Choose a New Page Element" page will pop up.
   
5. Click on "HTML/JavaScript" button, which enables you to add third-party functionality or other code to your blog.
   
6. Configure HTML/Javascript page will pop up.
   
7. Enter the title of your search engine (eg: my search engine) and then insert the following code into the "content" section:
   
8. Click here to receive the code (see example below).

*Note that predictad.com is listed as the default value above - if you'd like Google to search content from your own site or of another site (eg: Google, Yahoo, TechCrunch, etc.) than enter the appropriate website as the value (see pic). Otherwise searches on your blog will be done based on PredictAd's site content.
*Make sure to "save changes". Now you're ready to integrate PredictAd!

PredictAd Integration

1. Go to http://www.predictad.com/
   
2. Hit the "Get it Now" tab
   
3. Enter all the necessary information to sign up as a Publisher


4. After confirming you will receive an activation email with your password (if you don't see the activation email in your inbox make sure to check your spam folder).
   
5. Login to your PredictAd account.
   
6. Click on "PredictAd Setup"
   
7. Within the setup page you can add a custom autocomplete list, RSS feeds and a tag cloud (none of these are mandator in order to get started - they're simply neat Web 2.0 options).
   

Code Generator

1. After you've set up the additional PredictAd options, it's time to generate the code.
   
2. SearchBox number should match with appropriate custom autocomplete and RSS feeds (if none added keep on SearchBox 1).
   
3. If custom autocomplete phrases were updated than click on "custom autocomplete" in the "Database" field.
   
4. Ad Serving should remain on All Ads unless you prefer not to make money ; )
   
5. Text Input ID is "q" if you added Google code listed above. If not, text input ID will be the input ID in your current HTML code.
   
6. Your skin should remain "Classic" unless you want RSS feeds - in that case click on Classic + RSS.
   
7. Make sure Text Alignment is on "left".
   
8. You can preview and see how it looks (make necessary adjustments if needed).
   
9. Generate Code

Insert code into HTML on Blogger

1. Click "Template" in Blogger setup
   
2. Click "Edit HTML"
   
3. Copy & Paste the HEAD Code (from PredictAd Setup) into the appropriate sections in your HTML - click CTRL F and enter /head in order to find the HEAD section. Paste code into HEAD section.
   
4. Repeat step for pasting BODY code into the body section of your HTML.
   
5. Save Template.
   
6. PredictAd is now integrated - test it out yourself.

Congratulations! Now you've added a cool AutoComplete feature that helps monetize your site. Thank us later by spreading the word. Enjoy!

Please contact support@predictad.com if you have any further questions.