# BΛSΞ FRAMEWORK DOCUMENTATION

## Created by Clients - for Developers and Clients

- created: 01/01/2014
- last update: 11/16/2024
- by: SΛVΛGΞNΞRD
- email: support@buildwithbase.com
- View Changelog »

### BΛSΞ Overview

BΛSΞ is a one-of-a-kind framework in that it’s the first framework in the world to be created by Clients for Clients. But, if you’re a traditional Developer don’t worry, we made it super easy for you too.
BΛSΞ is an easy to use, lightweight, micro framework with a low learning curve and was designed for rapid development, simplicity, and speed. It includes its own page-templating engine and is based on object-oriented programming (OOP) with an industry-standard, module-based MVC architecture. (ie. Model-View-Controller).
Best of all, BΛSΞ is just the foundation of the comprehensive BΛSΞ Platform, a full-stack PHP framework that comes with a fully completed, ultra-responsive HTML + PHP front-end. So, basically you get a fully ready responsive website right out-of-the-box - saving you countless hours of development, design and UI/UX work.

Step 1. Log into your WordPress Admin area.
Step 2. Look down the left hand column for “Appearance” and then click on the button “Add new”.
Step 3. In the "Add new" page, click “Upload Theme” on top
Step 4. In the "Upload" page, click “Browse” to browse for the theme installation file in [path-to-your-downloaded-package]/Installation File/theme/sportcenter.zip). Click "Install Now".
Step 5. After installed successfully, click "Activate" to make the Sport Center active
Step 6. Install plugins in Plugins > Add New > Upload

#### Update

There are some ways to update theme:

- 1 - Install and use WP Envato Market Plugin.
- 2 - Download new version on Themeforest and Update manually (Upload via FTP)

All posts and settings will be saved. This is data-safe method. You need to update sportcenter's plugins manually

### Sport Center Layout

### Install Sample Data

#### 1 - WP Clone Import

- Install Sport Center theme and all included plugins, active all of them
- Install plugin WP Clone
- After installed WP Clone, go to WP Clone on admin sidebar menu
- Download Backup File from:

      https://www.dropbox.com/s/tz7mwod4884qg8a/sportcenter_wpclone_backup_300916.zip?dl=0

- Upload this file to your host/server and use your file's URL to importing
- Choose Restore from URL and enter your clone file's URL
- Make sure you've read all 3 cautions
- Check I AGREE and click Restore from URL
- After successful importing, you might need to login to your admin with this info
  Username: admin
  Password: 123456@
  Pls change this account's password and other info

#### 2 - Import Manually

You can use regular way to import data. you can find in /Sample Data/ folder:

- sportcenter-full.xml All sample data
- sportcenter-minimal.xml Only main homepage demo Data
- theme-options.txt Theme Options Settings

To install sample data, following these steps

- Make sure you have installed Sport Center theme and all recommended plugins
- Go to Tools > Import, then click on Wordpress
- If it is not yet installed before, you have to install it. On the popup, click "Install Now"
- After installed successfully, click on Activate Plugin & Run Importer
- Browse for [path-to-your-downloaded-package]/Installation File/Sample Data/sportcenter-xxx.xml and click Upload File and Import.
- After uploaded, the confirmation page appears. Check the Download and import file attachments option and click Submit. If you have trouble with importing (it might be failed in the middle due to long execution time), try again with this option Unchecked!
- After uploaded, the confirmation page appears. Check the Download and import file attachments option and click Submit
- When you see message "All done. Have fun!", you will know that the import is done.
- Go to Settings > Reading, set Front page displays to A Static page. Choose Home Page page as Front page and Blog as Posts page
- Go to Appearance > Menus, choose Main Navigation menu as Primary Menu and Top Nav as Secondary Menu
- Go to Option Tree > Settings > Import and paste content of Sample-Data/theme-options.txt into Theme Options text field, then click Import Theme Options button.
- OK, done!

### Menu Setup

- To config menu, go to Appearance > Menus
- Choose to Add new menu or Edit existing menu
- You could assign menu to menu locations when editing menu or in tab Manage Locations
- Remember to Save changes

### Homepage Setup

#### Create Frontpage and Blog

- Create 2 new pages (Pages > Add new), and publish them.
  We’ll call these “Home” and “Blog”.
- Go to Settings > Reading Settings, under “Front page displays”, click the radio button for A static page.
  Select “Home” in the first drop down (for Front page), and select “Blog” in the second one (for Posts page). Save the changes.

#### Frontpage Template

- Go to Pages > All Pages and edit “Home” page created in previous step
- Choose "Front Page" in Template.
- Choose Layout settings
- You should enable Visual Composer to build your home page easier

### Sidebar & Widget

#### Sidebar

- Main Sidebar - Applied for all pages
- Front page Sidebar - Used in Front page only
- Woocommerce Sidebar - Used in all Woocommerce pages
- Footer Sidebar - Appear in footer on all pages
- Bottom Sidebar - Appear on footer section and the underneath of Page content
- Pathway Sidebar - If any widget is used, it replaces default pathway, only appears on single page

#### Widgets

- Leafcolor Latest Posts: Display the latest Posts based on date, category...
  - Number of posts: how many posts to display
  - Post type: which post type to display
  - ID list show: specify post IDs to display
  - Tags: tags list
  - Categories: category ID or Slug list

### Theme Options

Sport Center comes with a lot of options to help you totally customize the look & feel of site. Go to Appearance > Theme Options to configure.

#### General

- Copyright Text: Appear in Footer
- RTL mode: Support RTL Languages
- Custom CSS: Enter custom CSS. Ex: .class{ font-size: 13px; }
- Custom Code: Enter custom code or JS code here. For example, enter Google Analytics
- Logo Image: Upload your logo image, appear on Main Navigation
- Retina Logo: Retina logo should be two time bigger than the custom logo. Retina Logo is optional, use this setting if you want to strictly support retina devices.
- Footer Logo Image: Upload your Footer logo image
- Login Logo Image: Upload your Admin Login logo image
- Pre-loading Effect: Choose to Enable Pre-loading Effect, please note: This effect will make your site feel slower
- Pre-Loading Background Color: Background color of loader
- Pre-Loading Spinners Color: Color of spinners

#### Colors & Background

- Main color: Choose Main color (Default is #f7c51e), used in many places (icon, button, menu active, hover...)
- Page Heading Background: Choose Page Heading background (Default is Main color)
- Footer Background Color: Choose Footer background color (Default is dark color)
- Bottom Background Image Choose Bottom Background

#### Fonts

- Main Font Family: Enter font-family name here. Google Fonts are supported. For example, if you choose "Source Code Pro" Google Font with font-weight 400,500,600, enter Source Code Pro:400,500,600
- Heading Font Family: Enter font-family name here. Google Fonts are supported. For example, if you choose "Source Code Pro" Google Font with font-weight 400,500,600, enter Source Code Pro:400,500,600 (Only few heading texts are affected)
- Main Font Size: Choose base font size
- Upload Custom Font 1: Upload your own font and enter name "custom-font-1" in "Main Font Family" or "Heading Font Family" setting above
- Upload Custom Font 2: Upload your own font and enter name "custom-font-2" in "Main Font Family" or "Heading Font Family" setting above

#### Main Navigation

- Main Navigation Style: Choose Main Navigation Style. There are 2 styles:
- Main Navigation Schema: Choose Main Navigation color schema. There are 2 style Dark (as above) and Light:
- Main Navigation Background Color: Choose Main Navigation background color
- Main Navigation Background Opacity: Choose Main Navigation background opacity (%)
- Sticky Navigation: Choose to Enable Sticky Navigation
- Enable Search: Enable or disable default search button on Navigation
- Top Navigation Content: Enter top navigation content. Ex:

      <span class="hidden-xs"><i class="fa fa-phone"></i> 0123-456-789</span>
      <span class="hidden-xs"><i class="fa fa-envelope-o"></i> info@edu.com</span>

- Top Navigation Tabs: Add top navigation tabs
  Example HTML for time table tab likes demo:

      <ul class="time-list list-inline">
       <li class="time-list-item">
        <a href="#">
         <div class="item-day">Monday</div>
         <div class="item-hour">8:00 AM - 10:00 AM</div>
        </a>
       </li>
       <li class="time-list-item">
        <a href="#">
         <div class="item-day">Wednesday</div>
         <div class="item-hour">2:00 PM - 8:00 PM</div>
        </a>
       </li>
      </ul>

#### Single Post

- Sidebar Layout: Select Sidebar Layout (Right, Left or Fullwidth)
- About Author: Enable to show About Author box
- Published Date: Enable to show Published Date
- Categories: Enable to show Categories
- Tags: Enable to show Tags
- Comment Count: Enable to show Comment Count
- Post Navigation: Enable to show Post Navigation

#### Single Page

- Sidebar Layout: Select Sidebar Layout (Right, Left or Fullwidth) for singe page

#### Archives

- Sidebar Layout: Select Sidebar Layout (Right, Left or Fullwidth) for Archive pages
- Archive Post Listing Style: Select Post Listing Style for Archive pages (Quick Ajax need to be installed)
Default:
Quick Ajax:
(There are other styles of Quick Ajax you could try)

#### 404

- Page Title: Page title of 404 page
- Page Content: Page Content of 404 page
- Search Form: Enable Search Form in 404 page

#### WooCommerce

- Sidebar Layout: Select Sidebar Layout (Right, Left or Fullwidth) for WooCommerce pages

#### Event

- Event Sidebar Layout: Select Sidebar Layout (Right, Left or Fullwidth)
- Show Heading Info: in Single Event
- Show Heading Categories: in Single Event
- Show Second Title, Info & All Event link in Single content: in Single Event
- Show Event Thumbnail in Single content: in Single Event
- Show Next/Prev Event: in Single Event
- Event Listing Sidebar Layout: Select Sidebar Layout (Right, Left or Fullwidth)

#### Member

- Member Sidebar Layout: Select Sidebar Layout (Right, Left or Fullwidth)
- Show Member's Upcomming Events: Enable to show Upcomming Events in Single Member
- Show Other Members: Enable to Show Other Members in Single Member
- Member Post Label: Ex: Trainers, Teachers... to show in site
- Member Post Slug: Change post slug. Remember to save the permalink settings again in Settings > Permalinks

#### Social Accounts

- Facebook: Enter full link to your account (including http://)
- Twitter: Enter full link to your account (including http://)
- LinkedIn: Enter full link to your account (including http://)
- Tumblr: Enter full link to your account (including http://)
- Google Plus: Enter full link to your account (including http://)
- Pinterest: Enter full link to your account (including http://)
- Youtube: Enter full link to your account (including http://)
- Flickr: Enter full link to your account (including http://)
- Custom Social Account: Add your owl Social Account with Font Awesome Icon
- Open Social link in new tab?: Enable to make social links open in new tab

#### Social Sharing

- Facebook Share: Enable Facebook Share Button
- Twitter Share: Enable Twitter Tweet Button
- LinkedIn Share: Enable LinkedIn Share Button
- Tumblr Share: Enable Tumblr Share Button
- Google+ Share: Enable Google+ Share Button
- Pinterest Share: Enable Pinterest Share Button
- Email Share: Enable Email Share Button

### Sport Center Shortcodes

#### Button Shortcode

    [sc_button size="small" style="0" link="#" icon="fa-rocket" color="#"]Label[/sc_button]

- You could use Font Awesome Icon class for button Icon
- If you does not choose button color, it will use Main color

#### Icon Box Shortcode

    [sc_iconbox icon="fa-trophy" heading="Heading" layout="center"]Content text[/sc_iconbox]

- You could use Font Awesome Icon class for button Icon
- If you does not choose icon color, it will use Main color

#### Post Slider Shortcode

    [sc_post_slider post_type="product" count="5" order="DESC" orderby="date" auto_play="0" height="700"]

- You could choose to query your post/product/event and display in a slider
- Enter max height to limit your slider height

#### Post Grid Shortcode

    [sc_post_grid column="4" post_type="product" count="7" order="DESC" orderby="date"]

- You could choose to query your post/product/portfolio and display in a grid

#### Post Carousel Shortcode

    [sc_post_carousel title="Events" icon="fa-calendar" link_text="View All" link_url="#" header_bg="2410" post_type="tribe_events" count="8" visible="4"]

- You could choose to query your post/product/event and display in a carousel
- Choose to show header to see header item

#### Post Timeline Shortcode

    [sc_post_timeline post_type="post" count="4" order="DESC" orderby="date"]

- You could choose to query your post/product/portfolio and display in a timeline layout

#### Product Listing Shortcode

    [sc_woo column="3" count="6" order="DESC" orderby="date"]

- You could choose up to 6 product per row, unlimited count number

#### Heading Shortcode

    [sc_heading align="center"]Sport <span class="main-color-1">Classes</span>[/sc_heading]

- You could choose Heading size, align and URL
- Heading will automatically change color on a Dark row

#### Testimonials Shortcode

    [sc_testimonial scroll="1"]
        [sc_testimonial_item name="John Dose" title="Manager" avatar="1761"]Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod [/sc_testimonial_item]
        [sc_testimonial_item name="Jeny weky" title="Developer" avatar="1972"]Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod [/sc_testimonial_item]
        [sc_testimonial_item name="John Dose" title="Manager" avatar="1761"]Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod [/sc_testimonial_item]
    [/sc_testimonial]

- You could add many testimonials as you want
- Avatar parameter should be attachment ID

#### Member Shortcode

    [member id="1968"]

- You need to install Sport Center - Member plugin to use this shortcode
- You should create some member posts first

#### Quick Ajax Shortcode

    [wpajax]

- You need to install Quick Ajax plugin to use this shortcode
- You could learn more about this plugin here

### Sport Center - Showcase Plugin

#### There are 4 Showcase Styles

- Style Listing
- Style Hero
- Style Features
- Style Layers

#### Pure CSS mobile devides

- There are many devide to choose
  - iPhone 5s (3 colors)
  - iPhone 5c (6 colors)
  - iPhone 4s (2 colors)
  - iPad Mini (2 colors)
  - Galaxy S5 (2 colors)
  - HTC One (1 colors)
  - Lumia 820 (6 colors)
  - Nexus 5 (1 colors)
- All of them are made with HTML and CSS
- Full Responsive and Retina Ready

#### How to Create

- In admin dashboard, go to Showcase > Add news
- In Add new screen, look down for Showcase Option
- You could choose Showcase Style first
- Then you need to add Screen Items or Devide base on your Style

#### Usage

- You could insert Showcase to your page/post content via shortcode
- You should enable Visual Composer to add Showcase Shortcode easier

### Pages & Posts

Each post/page has their own settings when editing. These settings are used to overwrite Theme Options Settings

### Other Settings

For best result, you should config Tribe Events in Wp-Admin > Events > Settings > Display

- Default stylesheet used for events templates: Choose Tribe Events Styles
- Events template: Choose Default Event Template
- You should create and enter Google map API for displaying map in Event

### Translation

Sport Center is a WMPL compatible and multi-language ready theme. To translate this theme:

- Download and install this tool POEdit
- Open POEdit and load [/sportcenter/languages/sportcenter.po]
- Translate the text and save the file
- A file named sportcenter.mo is created. Rename it with Code Name of your language. For example, de_DE.mo for German - Deutsche. See language code list here http://codex.wordpress.org/WordPress_in_Your_Language
- Open [{wordpress root}/wp_config.php] and find this line define('WPLANG', '');. Change it to your language code, for example define('WPLANG', 'de_DE');

Sport Center also supports RTL - Right To Left languages. If your language is RTL, go to Appearance > Theme Options > General > RTL mode and check Enable RTL

### Licenses

Used Assets

Font Awesome - by Dave Gandy (GPL License)

jscolor - by Jan Odvarko, http://odvarko.cz (GNU-GPL License)

Raumrot - by markusspiske (CC License)

Owl Carousel - by Bartosz Wojciechowski (MIT License)

Devide.css - by Marvelapp (MIT License)

Bootstrap - by @mdo and @fat (MIT License)

The list might not be complete by accident. Authors who think you owe a license in this theme, please contact us at leafcolor.com@gmail.com

### Support

If you face problems with the installation or using of our product please do not hesitate to contact us HERE