Osclass Themes and Osclass Plugins

Advertisement and banners

Introduction

Classifieds are business, often it starts as fun or hobby, just to spend some free time, but anyone doing classifieds and being more and successful will ask question: "How can i get money out of it"? There is few different ways, one is more effecient, another is less.

Two main income channels are:

  • Enable promotions - move to top, make premium, republish, publish fee, ...
  • Add banners and adverts

 

First one can be easily managed by Osclass Pay Plugin, that is simply best and more powerful plugin for promotions, republish, memberships, eCommerce and so on. Second one can be achieved using Advertisement Manager or Banner Ads plugins.

What is difference between them?

  • Advertisement Manager - more complex with functions like keyword, locations, ...
  • Banner Ads - easier version of above plugin with simple design and basic functionality

 

Most of themes already has predefined places for advertisement (adsense), but you may want to have detail statistics, set budget, follow spendings and show stats to customers.

 

Advertisement Manager Plugin

In this section we will create image banner with this plugin and place it to Zara theme. First install plugin to your osclass.

1) Create banner

Select image slider type, enter name, onclick URL (user is redirected there when click on banner), upload your image, set horizontal size to 300px and vertical size to 150px. You can also define price for click or view.

Remember to upload images of same size to same banner, otherwise it will not look nicely. Set banner size same to image size, so in our case image has 300x150 px, so banner will have same size.

You define also in which categories will be banner shown. In this way you can create set of banners, each for different category and add them to one banner group, so it is not required to modify theme files many times. To disable this option keep it blank.

 

2) Create banner group

Once banner is created, it is required to add it to one or more banner groups. Banner is single advert and is shown to customer using banner group. Banner group is container for one or more banners.

Enter name of group and (optionaly) short name. Shortname can be used to place group into theme files and using shortname instead of ID will help in maintenance. Let's name group as Home banners and short name as home_banners.

It's possible to define category association of banner group as well as for banners, keep it blank to disable this option.

Osclass Advertisement Manager Banner Group

3) Add banners into group

Once Banner and Group is done, it's time to associate banner with group, simply said add banner into banner group (container for banners). This can be done in Dashboard section of plugin - associate banner with group.

In left, select your newly created banner, in right select banner group Home Banners and click complete.

Osclass Advertisement Manager Banner to Group

In section bellow you can see list of all groups, list of all banners and association - banners associated with these groups. Each banner can be associated with multiple groups and group can have one or more banners.

 

4) Add banner group to theme

It's time to show banners to customers, for this it is required to add group code into theme. To find what code should be added into theme, go to banner group settings (for group that should be added to theme) and in at bottom you will find code, for our group it is:

<?php echo show_banner('home_banners'); ?>

As name of group tells, these are home page banners, therefore go to file: oc-content/themes/{your_theme_name}/main.php and place code anywhere you like it. If you cannot find proper position, just do trial & error.

When you adding code in place enclosed with tags , then you place to file just following code:echo show_banner('home_banners');

If you browse your homepage and you will see printed this code, it means you should have placed tags.

Osclass Advertisement Manager place banner to theme

Once it's done and file is saved, you will see banner in your homepage.

Osclass Advertisement Manager banner in theme zara

 

5) Extra formatting

Commong question now is: "How do I center banner?", questions regarding borders, positioning etc. For all those check CSS documentation or simply google it. You can add additional styles to plugin directly or place styles to your theme files. Each banner has unique class that can be found by pressing F12 in your browser (console) and checking element.

Each banner has classes: ad-banner b-class-{ID}, where {ID} is id of banner, so for example ad-banner b-class-11.

For example to center banner (very depends on theme used) add following to theme stylesheet (css):

.ad-banner {float: none!important; display: block; margin: 10px auto;}

Now banner should be centered.

 

Banner Ads Plugin

In this section we will take a look on how to create advertisement in Banner Ads plugin, how to add it to theme etc.

 

1) Create hook for banner

First we will add code to show banner in theme, so banners and adverts can be created in osclass much quicker. One hook can be used by multiple banners.

In Dashboard section - Custom hooks add name of this hook, let's call it home_banners. You can define multiple hooks - home, search, listing page etc.

Osclass Banner Ads custom hook

Now add code for hook into theme. Sample code is:

<?php if(function_exists('ba_hook')) { ba_hook('my_custom_hook'); } ?>

So in our case it will be :

<?php if(function_exists('ba_hook')) { ba_hook('home_banners'); } ?>

These hooks are written in way that even you uninstall plugin, it's not going to cause problems in your osclass theme and throw any error.

Final code in theme will look similar:

Osclass Banner Ads hook to theme

Take care on tags. Now all theme modifications are done and we can take a look how to show banner in this place.

 

2) Create banner

First let's create banner. There is difference in naming convention in Banner Ads (BA) plugin and Advertisement Manager (AM) plugin.

  • AM: Banner group == BA: Banner
  • AM: Banner == BA: Advert

Banner in Banner Ads plugin is container for adverts. Each banner can contain one or more adverts and each advert can be in multiple banners.

Set name to Home Bannners (or anything you like), select type how to show multiple adverts that banner contain:

  • Show all adverts - all advertisement of banner will be shown at once
  • Rotate adverts - only 1 advert will be shown at same time, adverts are rotated with fade effect. Waiting time and speed of fade effect can be changed in Dashboard section
  • Show 1 random advert - only 1 random advert is shown

Select hook where you want to show this banner, as we are working on home page banners, we will select only home_banners hook that was added to theme files in previous step.

As we did not create our adverts yet, do not select anything in section Adverts in Banner. Save Banner.

Osclass Banner Ads create banner

 

3) Create Advert (Advertisement)

Now it's time to create banner itself. Again we will create image banner of size 300x150 px with same image as in Advertisement Manager section. At top right menu click on Add Advert.

Select type to be Image Advert, enter name - Home Image Advert, define onclick URL, upload your image, set prices and budget if applicable. To size set width to be 300px and height 150px, you can select categories where advert will be shown (leave blank to disable) and Banners where advert will be shown.

Select banner created in previous step - Home Banners and click on create. Advert is created, it's added to banner and banner is shown using hook in theme.

Osclass Banner Ads advert

Summary

Hope this tutorial is clean enough to help you monetize you osclass quickly and effectively using Banner Ads or Advertisement Manager plugins. Which one is better? It's not possible to answer, right question is: "Which one is more suitable for me?".

Go to demo site and test both plugins!

9079 views