How to create a theme

From OSClass

OSClass allows you to use themes in order to change the appearance of your site and make it unique. This page will explain the process to create a theme for your site. Theme should be placed inside oc-content/themes/ folder.


Contents

What is GUI?

GUI is a fallback theme, included in OSClass, if you mess up and delete your themes folder, you will still show the default theme. Every file you need to modify is in the gui folder (yoursite.com/oc-includes/osclass/gui). You do not need to modify those files, they are only there as a security measure.

Where to start?

We include a default theme with OSClass, the modern theme. Also, modern theme include all the needed files. The easiest way to start creating your own plugin, is modifying an existing one. Copy your modern folder and rename it to mytheme. You could name it whatever you want, but for this tutorial, we'll be using mytheme, replace it when needed.


Modify the index file of your newly created theme, you should find this code: 

    function modern_theme_info() {
        return array(
             'name'        => 'OSClass Modern Theme'
            ,'version'     => '2.1'
            ,'description' => 'This is the OSClass modern theme'
            ,'author_name' => 'OSClass Team'
            ,'author_url'  => 'http://osclass.org'
            ,'locations'   => array('header', 'footer')
        );
    }


replace with this other: 

    function mytheme_theme_info() {
        return array(
             'name'        => 'My Custom Theme'
            ,'version'     => '1.0'
            ,'description' => 'This is my theme'
            ,'author_name' => 'Me'
            ,'author_url'  => 'http://www.mywebsite.com'
            ,'locations'   => array('header', 'footer')
        );
    }

You could fill the variables as you want, but we sure to place the same name of the folder on the function {name_of_the_folder}_theme_info, please, be sure to not include any white spaces in the name of your folder. You are ready to go.


Modify your files

Now, you're free to modify the files. Our advice is that you install OSClass in your localhost or in a test server, copy the the modern theme, rename it and start working. Then you install your theme and start modifying it, so you could see the changes directly.


Files

Theme files have very explanatory names, but here's a more detailed list of the file and what it does.

  • 404.php: This is the error page, some if something went wrong (we hope this doesn't happen!)
  • alert-form.php: This is the alert form, shown on search page to subscribe to the search
  • contact.php: Contact page to send a message to the admin of the website
  • custom.php: This is a launcher for custom pages (of plugins), you could modify it but be sure of include the following line <?php osc_render_file(); ?>
  • footer.php: Footer, shown at the end of the page
  • functions.php: This file will be included, place here custom functions of your theme
  • head.php: Head part of the HTML
  • header.php: Shown at the begining of the page
  • inc.search.php: This file is not required, but it's available on modern theme. This include the search bar on top of the header
  • index.php: You already know this file! This file holds the information of the theme (name, version, description,...)
  • item.php: This is the page of the detailed item view
  • item-contact.php: Page to contact the seller of an item
  • item-edit.php: Form to edit the item
  • item-post.php: Form to publish the item
  • item-send-friend.php: Send a friend form
  • main.php: The homepage of your site
  • page.php: Launcher for custom pages, you could modify it but be sure of include the following line <?php echo osc_static_page_title(); ?> to show the title and <?php echo osc_static_page_text() ; ?> to show the description of the custom page
  • screenshot.png: This is an image file to show a preview of your theme. Not really necessary but useful if you want to share your theme
  • search.php: This is the search page, this only shows the search bar and filters. You could use two different views, as gallery or as a list
  • search_gallery.php: Gallery view of search items (only items, search filters are located on search.php)
  • search_list.php: List view of search items (only items, search filters are located on search.php)
  • user-alerts.php: Users' panel to manage users' alerts
  • user-change_email.php: Users' panel to change email
  • user-change_password.php: Users' panel to change password
  • user-dashboard.php: Users' dashboard (the page they see when they log in)
  • user-forgot_password.php: Form when the user forgot it password
  • user-items.php: Users' panel to manage users' items
  • user-login: Page to log in (in modern theme, you could log-in directly from the header, but this file is required and useful if login failed)
  • user-profile: Page that shows the user profile (to edit it)
  • user-recover: Page to recover the password
  • user-register: Form to register
  • Other files: located in folders css,images,js,languages,... they're not required, but useful as you made the theme


Helpers

In oc-includes/osclass/helpers/ you will find several Helpers files. They're simple functions to interact with the core of OSClass.


The full documentation of helper functions could be found at the official documention of OSClass or in the Helpers page.

Retrieved from "http://doc.osclass.org/How_to_create_a_theme"