Documentation

[c5ab_tabs type= »side-left »]
[c5ab_tab title= »Installing Alyoum » icon= »fa fa-cloud-upload »]

After your Purchase:

After your purchase, unzip the file you will download and upload the file valencia.zip through your wordpress admin panel.

To upload the Theme

[c5ab_ul]
[c5ab_li icon= »fa fa-check »]Go to Appearance -> Themes[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Choose Install Themes tab[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Choose Upload mini-tab[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Choose the file and upload it, then click activate.[/c5ab_li]
[/c5ab_ul]

Or you can see the WordPress installation details here.

[/c5ab_tab]

[c5ab_tab title= »Install Like Demo » icon= »fa fa-copy »]

After Installing AlYoum, we recommend to install the demo data and make it the start point for your work.

[c5ab_ul] [c5ab_li icon= »fa fa-check »]Import the file demo.xml in Tools->Import[/c5ab_li] [c5ab_li icon= »fa fa-check »]Import the sidebars by loading widget_data.json in Tools->Widgets Settings Import[/c5ab_li] [c5ab_li icon= »fa fa-check »]Assign the Main Menu in Appearance->Menu[/c5ab_li] [c5ab_li icon= »fa fa-check »]In Appearance->Import/Export Options get the options code from option.txt and paste it there and click Import[/c5ab_li] [c5ab_li icon= »fa fa-check »]In Appearance->Theme Options Assign The Homepage and footer from the imported templates. « If it is not assigned »[/c5ab_li] [c5ab_li icon= »fa fa-check »]By that you will have the demo installed.[/c5ab_li] [/c5ab_ul]

[c5ab_title apperance= »title-style-1″ title= »Check list »]

[c5ab_ul] [c5ab_li icon= »fa fa-check »]Add the Logo, favicon and adjust the main elements in the Theme Options[/c5ab_li] [c5ab_li icon= »fa fa-check »]Create the Main Menu and footer menu and assign them[/c5ab_li] [c5ab_li icon= »fa fa-check »]Add the widgets to your sidebars[/c5ab_li] [c5ab_li icon= »fa fa-check »]Create your Homepage and assign it.[/c5ab_li] [c5ab_li icon= »fa fa-check »]Create the rest pf the pages.[/c5ab_li] [/c5ab_ul]

[/c5ab_tab]

[c5ab_tab title= »General Settings » icon= »fa fa-cog »]

After installation you should see the Slides Menus added to your menu.

You can reach the Theme Options by:

In Dashboard, Click on Appearance -> Theme Options to see the main options for your theme

From the Top bar from any page in your website

On the General Settings

[c5ab_ul]
[c5ab_li icon= »fa fa-check »]Set the Logo[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Set the favicon[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Choose the homepage[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Choose if the website is RTL[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Enable the preview Mode to test some colors in your website.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Add the email will be used in the contact us page[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Add Google Analytics Code[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Add Custom CSS Code if you want[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Add Custom Javascript Code if you want[/c5ab_li]
[/c5ab_ul]

Click Save Changes

[/c5ab_tab]

[c5ab_tab title= »Styling Settings » icon= »fa fa-tint »]

In this Section, you can edit the colors and fonts of the theme.

[c5ab_ul]
[c5ab_li icon= »fa fa-check »]Set the Primary Color, Default #d64a2b[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Upload the Background and adjust it’s settings.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Choose the Primary Font « Default: Oswald ».[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Choose the Body Font « Default: Open Sans ».[/c5ab_li]

[/c5ab_ul]

Click Save Changes

[/c5ab_tab]
[c5ab_tab title= »Social Settings » icon= »fa fa-facebook »]

In this Section, you can edit Social Accounts of your website.

[c5ab_ul]
[c5ab_li icon= »fa fa-check »]In the Theme Options Page, Go to Social[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Add the social media links [/c5ab_li]
[c5ab_li icon= »fa fa-check »]Note That if you dont want to display any of these leave it’s area blank[/c5ab_li]
[/c5ab_ul]

[c5ab_title apperance= »title-style-1″ title= »About Facebook App and Facebook Thumb »]

This to relate all facebook activities to your facebook App and the image will be used when not thumbnail available when sharing on facebook.

Click Save Changes

[/c5ab_tab]

[c5ab_tab title= »Menu » icon= »fa fa-list-ul »]

In this Section, you can edit The Menus for your website.

To Create a Menu:

[c5ab_ul]
[c5ab_li icon= »fa fa-check »]Go to Appearance->Menu.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Create your menu and assign it.[/c5ab_li]
[/c5ab_ul]

[c5ab_title apperance= »title-style-1″ title= »Icons in Menu »]

To Enable The Icons, Press on the Screen Options on the top of the page and enable css-classes, and add the class for any icon in this field.

You can access all the icons available Here

[/c5ab_tab]
[c5ab_tab title= »Sidebars » icon= »fa fa-columns »]

In this Section, you can edit The Sidebars for your website.

Tasty comes with 6 Ready Sidebars:

[c5ab_ul]
[c5ab_li icon= »fa fa-check »]Default Sidebar: This Shows in the Search, Author or Categories Pages & Default Left Sidebar[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Post Sidebar: This Shows by default in all the Articles. & Post Left Sidebar[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Page Sidebars: This Shows by default in all Pages. & Page Left Sidebar[/c5ab_li]
[/c5ab_ul]

To Create a new Sidebar:

[c5ab_ul]
[c5ab_li icon= »fa fa-check »]Go to Theme Options Page, Then Sidebars tab[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Click Add New, then Enter the Title and Slug and Description.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Click Save Changes.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Go to Appearance -> Widgets and you will find the new Sidebar there.[/c5ab_li]
[/c5ab_ul]

To Assign Sidebar:

[c5ab_ul]
[c5ab_li icon= »fa fa-check »]Go to Page/post Edit Page.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]You will find A Box Called General Settings below the content Area.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Choose the Layout to be Right or Left.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Choose your customised Sidebar for this Page/Post[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Click Update[/c5ab_li]
[/c5ab_ul]

[/c5ab_tab]

[c5ab_tab title= »Slider » icon= »fa fa-picture »]

In this Section, you will learn about the slider in your website.

Alyoum comes with Ready Slides Custom Type.

[c5ab_title apperance= »title-style-1″ title= »Creating A Slide »][c5ab_ul]
[c5ab_li icon= »fa fa-check »]In the Left menu in the dashboard you will find Slides Menu.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Click Add Slide.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Below the content Area you will find Box Called Slider Settings[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Choose the Type and edit the data then Click Publish.[/c5ab_li]
[/c5ab_ul]

[c5ab_title apperance= »title-style-1″ title= »Slides Type »]

[c5ab_title apperance= »title-style-1″ title= »1- Use Featured Image as a background and the title and content as the box »][c5ab_ul]
[c5ab_li icon= »fa fa-check »]Image: Upload it in the Featured Image Area[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Title: Add it As the slide title.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Content: Add it in the Content[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Button: Add the text and link in the side box.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Box Position: Choose the Box Position you want[/c5ab_li]
[/c5ab_ul]

[c5ab_title apperance= »title-style-1″ title= »2- Use video fields as the source for the slide »][c5ab_ul]
[c5ab_li icon= »fa fa-check »]Video: at the bottom of the Slide Settings Area, Choose the type of the video[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Add the video ID.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Options Available for Videos: Youtube, Vimeo and Dailymotion.[/c5ab_li]
[/c5ab_ul]

[c5ab_title apperance= »title-style-1″ title= »3- Get the slide content from a post, Choose it from the dropdown below »][c5ab_ul]
[c5ab_li icon= »fa fa-check »]Choose the Post from the Slide Settings Area.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Image: Will Fetch the Post Featured Image Automatically.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Title: Will Fetch the Post Title Automatically.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Content: Will Fetch the Post Excerpt Automatically[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Box Position: Choose the Box Position you want[/c5ab_li]
[/c5ab_ul]

[c5ab_title apperance= »title-style-1″ title= »Creating the slider it self. » icon= »none »][c5ab_ul]
[c5ab_li icon= »fa fa-check »]In the Edit Page you will find a Box called Slider Settings.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Turn the Show Slider Dropdop to Yes.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Then Click Add New.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Choose the Slide from the drop down.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Add the slides you want and rearrange them as you like.[/c5ab_li]
[c5ab_li icon= »fa fa-check »]Click Publish or update.[/c5ab_li]
[/c5ab_ul]

[/c5ab_tab]
[c5ab_tab title= »Shortcodes Generator » icon= »fa fa-magic »]

In this Section, you will learn about Shortcodes available in your website and its generator.

AlYoum comes with 90+ Shortcodes, All fo them Available in the shortcodes Generator.

[c5ab_title apperance= »title-style-1″ title= »Using the Shortcodes Generator » icon= »none »]

In Any Edit Page you can find our little magic button, click it and the shortcodes generator pop up will appear.

[c5ab_image src= »http://carmen.code125.com/wp-content/uploads/2012/08/Screen-Shot-2012-08-27-at-12.58.47-PM-copy.png » float= »none »]

You will find the pop with dropdown menu of all the available shortcodes, choose any ro display it’s settings

[c5ab_image src= »http://carmen.code125.com/wp-content/uploads/2012/08/Screen-Shot-2012-08-27-at-1.02.42-PM.png » float= »left »]

Add it’s parameters and Click Generate.

[/c5ab_tab]

[c5ab_tab title= »Builder » icon= »fa fa-building »]

In this Section, you will learn about the layout Builder in your theme.

In ANY Page Edit you will find section called: layout Builder.

[c5ab_ul] [c5ab_li icon= »fa fa-check »]First, Turn the Dropdown to Yes to enable the Layout Builder for this Page[/c5ab_li] [c5ab_li icon= »fa fa-check »]Click Add New[/c5ab_li] [c5ab_li icon= »fa fa-check »]Choose one of the templates you created[/c5ab_li] [c5ab_li icon= »fa fa-check »]Click Update page.[/c5ab_li] [/c5ab_ul]

Create a template

[c5ab_ul] [c5ab_li icon= »fa fa-check »]Go to Appearance->Page Builder[/c5ab_li] [c5ab_li icon= »fa fa-check »]Add the template name and Click Create template.[/c5ab_li] [c5ab_li icon= »fa fa-check »]You will find the available shortcodes as blocks and categorizad by its usage « to make it easier to find your shortcode »[/c5ab_li] [c5ab_li icon= »fa fa-check »]Below the blocks you will find the layout blocks, first you will build your layout then add the shortcodes block to it[/c5ab_li] [c5ab_li icon= »fa fa-check »]Build your layout and click Save Template.[/c5ab_li] [/c5ab_ul]

That’s it 🙂

[/c5ab_tab]

[c5ab_tab title= »Homepage » icon= »fa fa-home »]

In this Section, you will learn about Assigning your Homepage.

[c5ab_ul] [c5ab_li icon= »fa fa-check »]In Theme Options -> General Settings.[/c5ab_li] [c5ab_li icon= »fa fa-check »]You will find HomePage Option.[/c5ab_li] [c5ab_li icon= »fa fa-check »]Choose the Page you want to display as your Homepage.[/c5ab_li] [c5ab_li icon= »fa fa-check »]Click Save Changes.[/c5ab_li] [/c5ab_ul]

Note: You will have the exact copy of the page selected in homepage.

That’s it 🙂

[/c5ab_tab]
[c5ab_tab title= »Retina Display » icon= »fa fa-eye-open »]

AlYoum Theme is Retina Display Ready, All the images in the theme is icons and fits any retina display, to achieve 100% Retina you need to install WP Retina 2X

[/c5ab_tab]

[c5ab_tab title= »Footer » icon= »fa fa-road »]

In this Section, you will learn about Creating your Footer.

[c5ab_ul] [c5ab_li icon= »fa fa-check »]In Theme Options -> Footer Settings.[/c5ab_li] [c5ab_li icon= »fa fa-check »]Using the Layout Builder Method, Create a template with your footer layout[/c5ab_li] [c5ab_li icon= »fa fa-check »]Choose it from the available templates[/c5ab_li][/c5ab_ul]

Click Save Changes

[/c5ab_tab]

[c5ab_tab title= »Translation » icon= »fa fa-th-large »]

In this Section, you will learn about Translating your website.

To translate your website, use the files located in library/languages/defauklt.po and open it using POEdit and translate the theme strings to your local language, I only supports now the Arabic translation as it is my native language, any help to translate the website will be appreciated.

After that save it and upload them to library/languages/, for example you saved it as fr_FR.po, a new file will be also created fr_FR.mo, You must upload both of them to the folder

Now open your WordPress site root and open wp-config.php and make sure that WP_LANG is like this

define('WPLANG', 'fr_FR');

If your website language is supported via RTL, you should enable the rtl from the Theme Options Page.

That’s it, your website is ready for your local language.

[divider]

Note: You can use PoEdit program to edit the po file.

[/c5ab_tab]
[c5ab_tab title= »Credits » icon= »fa fa-quote-left »]

The Credits of the stuff used in this template goes to.

[c5ab_ul]
[c5ab_li icon= »fa fa-check »]Photos from karim Adam [/c5ab_li]
[/c5ab_ul]

[/c5ab_tab]
[/c5ab_tabs]