Drupal 7 - Hermio Theme Guide for Developers

Image styles are the presets of image settings. Image styles are used to define how the images are shown.

Navigate to Configuration, In MEDIA area, click Image styles, then create image styles as the following:

Step 1: Navigate to Store > Product add following fields:

Step 2: Add fiedls and set following properties for Product types: Event

Step 3: Go to Manage Display > Default tab, set following properties:

Step 4: Go to Manage Display > Line Item tab, set following properties:

Step 5: Go to Manage Display > Teaser tab, set following properties:

Step 6: Add fiedls and set following properties for Product types: Donation

Step 7: Go to Manage Display > Default tab, set following properties:

Step 8: Go to Manage Display > Line Item tab, set following properties:

Step 9: Go to Manage Display > Teaser tab, set following properties:

Step 10: Add fiedls and set following properties for Product types: Product

Step 11: Go to Manage Display > Default tab, set following properties:

Step 12: Go to Manage Display > Line Item tab, set following properties:

Step 13: Go to Manage Display > Teaser tab, set following properties:

Step 14:Click Save button

Step 1: Navigate to Structure > Content Type > Blog entry . In Blog entry , go to Manage fields tab, add following fields:

Step 2:Set properties for Images field

Step3:Set properties for Content field

Step 4:Set properties for Blog Type field

Step 5:Set properties for Slideshow field

Step 6: Go to Manage display tab > Default tab, set following properties:

Step 7: Modify Teaser tab, set following properties:

After you finish these steps, you can add some products but they weren't displayed anywhere because you should create a content type for their display.

We built Hermio based on Drupal Commerce, so you should read Drupal commerce guide to understand more how to use our product.

Step 1:Navigate to Structure > Content Type > Article . In Donation , go to Manage fields tab, add following fields:

Setup 2: Set properties for Image field:

Setup 3: Go to Manage Dislay > Default tab, add following field:

Step 4: Modify Teaser tab, set following properties:

Step 1:Navigate to Structure > Content Type > Donation . In Donation , go to Manage fields tab, add following fields:

Setup 2: Set properties for Image field:

Setup 3: Go to Manage Dislay > Default tab, add following field:

Setup 1: Navigate to Structure > Content Type. Click Add Content Type link to create content type Ads

Setup 2:Go to Manage Fields and add following fields:

Setup 3:Set properties for Image fields:

Setup 1: Navigate to Structure > Content Type. Click Add Content Type link to create content type Event

Setup 2:Go to Manage Fields and add following fields:

Setup 3:Set properties for Image fields:

Setup 4:Set properties for Gallery fields:

Setup 5:Set properties for Type fields:

Setup 6:Set properties for Product fields:

Setup 7:Set properties for Donate Counter fields:

Setup 8:Set properties for Donate Total fields:

Setup 9:Set properties for Donate Goal fields:

Setup 10:Go to Manage display tab > Default set following properties:

Setup 11:Go to Manage display tab > Teaser set following properties:

Setup 1: Navigate to Structure > Content Type. Click Add Content Type link to create content type Gallery

Setup 2:Go to Manage Fields and add following fields:

Setup 3:Set properties for Gallery fields:

Setup 4:Go to Manage display tab > Default set following properties:

Setup 5:Go to Manage display tab > Teaser set following properties:

Setup 1: Navigate to Structure > Content Type. Click Add Content Type link to create content type Product

Setup 2:Go to Manage Fields and add following fields:

Setup 3:Set properties for Image fields:

Setup 4:Set properties for Product fields:

Setup 5:Go to Manage display tab > Default set following properties:

Setup 6:Go to Manage display tab > Teaser set following properties:

Setup 1: Navigate to Structure > Content Type. Click Add Content Type link to create content type Sponsor

Setup 2:Go to Manage Fields and add following fields:

Setup 3:Set properties for Image fields:

Setup 4:Set properties for Link fields:

Setup 5:Go to Manage display tab > Default set following properties:

Setup 6:Go to Manage display tab > Teaser set following properties:

Setup 1: Navigate to Configuration > People section > Account settings > Manage Fields to view fields

Setup 2: Navigate to People > Permissions > Roles add following role

After installing many modules of Block

Setup 1: Navigate to Structure > Block types click Add block type link. Create block type About with following properties:

Setup 2: Go to Manager Display tab and set following properties:

Setup 3: Click Saveto button

After installing many modules of Drupal Commerce, you will see the store menu in administrator menu bar. Now you can manipulate store through it.

To configure this future, you must install Field Collection module, then navigating to Structure > Field Collection and edit field collection :

Setup 1: In Field_content find field_content. Go to Manage fields tab, add following fields:

Step 2:Set properties for Images field

Step 3:Modify Manage Display tab, set following properties:

Setup 4: In Field_content find field_bean_content. Go to Manage fields tab, add following fields:

Step 5:Set properties for Images field

Step 6:Modify Manage Display tab, set following properties:

Step 7:Click Save button

Note You can read this article to understand more about Field Collection.

Step 1: Navigate to Structure > Blocks, click Add Block link, Create Headerline info block with following properties:

Step 2: Navigate to Structure > Blocks, click Add Block link, Create Contact phone block with following properties:

Step 3: Navigate to Structure > Blocks, find Search form block, click configure link and set the following properties:

Step 1: Navigate to Structure > Views, click Add new view, then create Bootstrap Slideshow view with following settings:

Step 2: Click Continue and edit button. Next to steps below to set properties for following fields:

Step 3: At FIELDS area, click Add button to add fields: Content: Body, Content: Slideshow, Content: Link, Global: Fieldset, Global: Fieldset.

Step 4: Set properties for Content: Body

Step 5: Set properties for Content: Slideshow

Step 6: Set properties for Global: Fieldset

Step 7: Set properties for Global: Fieldset

Step 8: Set properties for Link

Step 9: At FIELDS area, click Rearrange button and set following arrange

Step 10: At FORMAT area, set following properties:

Step 11: At FILTER CRITERIA area, Content: Type , Content: Slideshow:fid

Step 12: Click Add button to add Content: Type

Step 13: Click Add button to add Content: Slideshow:fid

Step 14: Click Save to save view

Step 1: Navigate to Structure > Blocks

Step 2: Find View: Slideshow click configure link, set following properties

Step 3: Click Save block button.

Create and configure Help us view block

1. Create Help us view

2. Configure Help us block

Create and configure Together, We Can Build Awareness for Change block

Change order block in the Panel First list

Create and configure block

Step 1: Navigate to Structure > Blocks, click Add block link, Create Featured Posts block with following properties:

Step 2: Click Save block button.

Step 1: Navigate to Structure > Views, click Add new view, then create Blog view with following settings:

Step 2: Click Continue and edit button. Next to steps below to set properties for following fields:

Step 3: At FIELDS area, click Add button to add fields: Field: Image, Content : Body

Step 4: Set properties for Field: Image

Step 5: Set properties for Content : Body

Step 6: At FIELDS area, click Rearrange button and set following arrange

Step 7: At FORMAT Format: Grid area, click Settings and set following properties:

Step 8: At FILTER CRITERIA area

Step 9:Click Add button to add Content: Type

Step 10:Click Add button to add Content: Has taxonomy term

Step 11:Click Add button to add Content: Field: Image:fid

Step 12: At PAGE area, set User pager:

Step 13: At PAGE area, set More link:

Step 14: At Advanced > OTHER area, set CSS class

Step 15: Click Title and set following properties:

Step 16: Click Display name and rename the Blog Block block :

Step 17: Click Save to save view

Step 1: Click Clone Blog Block and set following properties:

Step 2: Click Display name and set following properties:

Step 3: At FIELDS area, click Content: Body set following properties:

Step 4: At FILTER CRITERIA area, click Content: Has taxonomy termset following properties:

Step 5: Click Save to save view

Step 1: Navigate to Structure > Views, click Add new view, then create Event view with following settings:

Step 2: Click Continue and edit button. Next to steps below to set properties for following fields:

Step 3: At FIELDS area, click Add button to add fields: Field: Image, Content : Body

Step 4: Set properties for Field: Image

Step 5: Set properties for Content: Body

Step 6: At FIELDS area, click Rearrange button and set following arrange

Step 7: At FILTER CRITERIA area

Step 8:Click Add button to add Content: Type

Step 9:Click Add button to add Content: Field: Image:fid

Step 10: At PAGE area, set More link:

Step 11: At HEADER area, click Add button add field Global: Unfiltered text

Step 12: Click Title and set following properties:

Step 13: Click Display name and rename the Block Tab block :

Step 14: Click Save to save view

Step 1: Navigate to Structure > Quicktab , click Add Quicktabs Intance, then create Featured Post Tab quicktab with following settings:

Step 2: Click Edit quicktab Featured Post Tab and set following properties:

Step 3: Click Save to save quicktab

Step 1: Navigate to Structure > Blocks,find Featured Post Tab link, block with following properties:

Step 2: Click Save block button.

Step 1: Navigate to Structure > Views, click Add new view, then create Sentences That Fit view with following settings:

Step 2: Click Continue and edit button. Next to steps below to set properties for following fields:

Step 3: At FIELDS area, Click Add button to add Global: Custom text, Content: Body, Global: Fieldset, Content: Link, Global: Custom text

Step 4:Set properties for Global: Custom text

Step 5:Set properties for Content: Body

Step 6:Set properties for Global: Fieldset

Step 7:Set properties for Content: Link

Step 8:Set properties for Global: Custom text

Step 9: At FIELDS area, click Rearrange button and set following arrange

Step 10: At FILTER CRITERIA area, Click Add button to add Content: Nid

Step 11:Set properties for Content: Nid

Step 12: At Advanced > OTHER area, add CSS class

Step 13: Click Save to save view

Step 1: Navigate to Structure > Blocks,find View: Sentences That Fit link, block with following properties:

Step 2: Click Save block button.

Step 1: Navigate to Structure > Views, click Add new view, then create Scattered Polaroids Gallery view with following settings:

Step 2: Click Continue and edit button. Next to steps below to set properties for following fields:

Step 3: At FORMAT area, click Fiedls and set following properties:

Step 4: At FORMAT Show : Scattered Polaroids area, click Settings and set following properties:

Step 5: At FIELDS area, Click Add button to add Content: Gallery

Step 6: At HEADER area, click Add button add field Global: Unfiltered text

Step 7: At Advanced > OTHER area, add CSS class:

Step 8: Click Save to save view

Step 1: Navigate to Structure > Blocks, Find View: Scattered Polaroids Gallery click configure link, set following properties

Step 2: Click Save block button.

Step 1: Navigate to Structure > Blocks, click Add block link, Create What's new block with following properties:

Step 2: Click Save block button.

Refer to following HTML code:

from 2011 to 2014

Proin sapien ipsum, porta a, auctor quis, euismod ut, mi. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Donec id justo. Nulla sit amet est. Etiam vitae tortor.

Step 1: Navigate to Structure > Blocks Type, click Add block types link, Create Static block type with following properties:

Step 2: Go to Manage Display tab link, and block type with following properties:

Step 3: Click Save block type button.

Step 1: Navigate to Content > Blocks, click Add blocks link, Create Charity events block type with following properties:

Step 2: Navigate to Structure > Blocks, find Charity events blocks link, with following properties:

Step 3: Click Save blocks button.

Step 1: Navigate to Content > Blocks, click Add blocks link, Create Programs block type with following properties:

Step 2: Navigate to Structure > Blocks, find Programs blocks link, with following properties:

Step 3: Click Save blocks button.

Step 1: Navigate to Content > Blocks, click Add blocks link, Create Statistic Donation block type with following properties:

Step 2: Navigate to Structure > Blocks, find Statistic Donation blocks link, with following properties:

Step 3: Click Save blocks button.

Step 1: Navigate to Content > Blocks, click Add blocks link, Create Volunteers block type with following properties:

Step 2: Navigate to Structure > Blocks, find Volunteers blocks link, with following properties:

Step 3: Click Save blocks button.

Step 1: Navigate to Structure > Views, click Add new view, then create The World Face Extinction Everyday view with following settings:

Step 2: Click Continue and edit button. Next to steps below to set properties for following fields:

Step 3: At FIELDS area, Click Add button to add Global: Custom text, Content: Body, Global: Fieldset, Content: Link

Step 4:Set properties for Global: Custom text

Step 5:Set properties for Content: Body

Step 6:Set properties for Global: Fieldset

Step 7:Set properties for Content: Link

Step 8: At FIELDS area, click Rearrange button and set following arrange

Step 9: At FILTER CRITERIA area, Click Add button to add Content: Nid

Step 10:Set properties for Content: Nid

Step 11: At Advanced > OTHER area, add CSS class

Step 12: Click Save to save view

Step 1: Navigate to Structure > Blocks,find View: The World Face Extinction Everyday link, block with following properties:

Step 2: Click Save block button.

Step 1: Navigate to Structure > Views, click Add new view, then create Sponor view with following settings:

Step 2: Click Continue and edit button. Next to steps below to set properties for following fields:

Step 3: At FIELDS area, Click Add button to add Field: Image, Content: Link

Step 4:Set properties for Field: Image

Step 5:Set properties for Content: Link

Step 6: At FIELDS area, click Rearrange button, remove Title and set following arrange

Step 7: At Advanced > OTHER area, add CSS class

Step 8: Click Setting jCarousel add set following properties:

Step 9: Click Save to save view

Step 1: Navigate to Structure > Blocks,find View: Sponor link, block with following properties:

Step 2: Click Save block button.

Step 1: Navigate to Structure > Blocks, click Add block link, Create External links block with following properties:

Step 2: Click Save block button.

Refer to following HTML code:

Step 1: Navigate to Structure > Views, find Event click Add Block create Block Footer

Step 2: Click Continue and edit button. Next to steps below to set properties for following fields:

Step 3: At FIELDS area, Click Add button to add Content: Post Date

Step 4:Set properties for Content: Post Date

Step 5:Set properties for Content: Title

Step 6: At FIELDS area, click Rearrange button, removeField: Image and set following arrange

Step 7: At Advanced > OTHER area, add CSS class

Step 8: Click Format add set following properties:

Step 9: At PAGE area, click Use Pager button, and set following arrange

Step 10: Click Save to save view

Step 1: Navigate to Structure > Blocks,find View: Events: Block Footer link and block with following properties:

Step 2: Click Save block button.

Step 1: Navigate to Structure > Views, Click Add new view create view Gallery and set following properties:

Step 2: Click Continue and edit button. Next to steps below to set properties for following fields:

Step 3: At FIELDS area, Click Add button to add Content: Gallery

Step 4:Set properties for Content: Gallery

Step 5: At FIELDS area, click Rearrange button, remove Content: Title

Step 6: At Advanced > OTHER area, add CSS class

Step 7: Click Display name add set name block: Footer Block

Step 8: Click Save to save view

Step 1: Navigate to Structure > Blocks,find View: Photo Gallery: Footer Block link and block with following properties:

Step 2: Click Save block button.

Step 1: Navigate to Structure > Views, find view Front page and click Enable view. Go to Page link and set following properties:

Step 2: At FIELDS area, Click Add button to add Content: Title, Content: Body, Content: Link, Global: Fieldset, Field: Image

Step 3:Set properties for Content: Title. Find Rewrite results and set properties:

Step 4:Set properties for Content: Body

Step 5:Find Rewrite resultsat FIELDS Content: Body and set properties:

Step 6:Set properties for Content: Link

Step 7:Set properties for Field: Image

Step 8:Set properties for Global: Fieldset

Step 9: At FIELDS area, click Rearrange button and set following properties:

Step 10: At FIELDS CRITERIA area, click Add button to add Content : Type and set properties:

Step 11: At FIELDS CRITERIA area, click Rearrange button and set following properties:

Step 12: Click Title add set Title page: Welcome to Hermio!

Step 13: Click Fomat add set following properties:

Step 14: Click Show add set following properties:

Step 15: At HEADER click Add button to add Global: Unfiltered text set following properties:

Step 16: At Advanced > OTHER area, add CSS class

Step 17: Click Save to save view

Step 1: Go to Module, find Simplenews module. Click Permission link

Step 2: Find Simplenews section, set following properties:

Step 3: Click on Configure link, set following properties

Step 4: Go to Structure > Blocks, find Simplenews block. Click Configure link and set following properties:

Step 5: Click Save block button.

Step 1: Navigate to Structure > Blocks, click Add block link, Create Contact Info block with following properties:

Ste p 2: Click Save block button.

Refer to following HTML code:

Step 1: Navigate to Structure > Blocks, click Add block link, Create Copyright block with following properties:

Step 2: Click Save block button.

Refer to following HTML code:

• Privacy policy
• [email protected]

© Copyright 2014 Hermio. All rights reserved.

Step 1: Navigate to Structure > Blocks, click Add block link, Create Powered by WeebPal block with following properties:

Step 2: Click Save block button.

Refer to following HTML code:

							Site by: WeebPal
						

Step 1: Navigate to Structure > Views, click Add new view, then create Donation view with following settings:

Step 2: Click Continue and edit button. Next to below steps to set properties for following fields:

Step 3: Att TITLE Title click and rename the Donation block

Step 4: At FORMAT Format area, click Setting and set following propesties:

Step 5: At FILTER CRITERIA area, Click Add button to add Field : Image, Global: Fiedset, Content: Body, Content: Link field with following properties:

Step 6: Set properties for Field : Image

Step 7: Set properties for Global: Fiedset

Step 8: Set properties for Content: Body

Step 9: Set properties for Content:Link

Step 10: At FIELDS area, click Rearrange button and set following arrange

Step 11: At FILTER CRITERIA area , click Add button to add field Content: Sticky with following properties:

Step 12: At PAGE User page area , click Settings following properties:

Step 13: At Advanced > OTHER area, add CSS class:

Step 14: Click Save button to save settings.

Step 1: Navigate to Structure > Blocks

Step 2: Find View: Donation click configure link, set following properties

Step 3: Click Save block button.

Step 1: Click Clone Blog Block block view and set following properties:

Step 2: Click Display name and set following properties:

Step 3: At FIELDS area, click Add button to add fields: Content: Video, Content: Blog Type, Content: Post date

Step 4:Set propertiesContent: Body fields

Step 5:Set properties Field: Image fields

Step 6:Set properties Content: Video fields

Step 7:Set properties Content: Blog Type fields

Step 8:Set properties Content: Post date fields

Step 9:At FIELDS area, click Rearrange button and set following arrange

Step 10: At FILTER CRITERIA area, click Remove following fields: Content: Has taxonomy term, Content: Field: Image:fid

Step 11:At FORMAT Format: Grid area, click Settings and set following properties:

Step 12:At HEADER area, click Add button to add field Global: Unfiltered text and set properties:

Step 13:At PAGE User pager area, set properties:

Step 14: At Advanced > OTHER area, set CSS class

Step 15: Click Save to save view

Step 1: Navigate to Structure > Blocks

Step 2: Find View: Blog: Block grid homepage 3 click configure link, set following properties

Step 3: Click Save block button.

Step 1: Navigate to Structure > Views, Find Help us link. Click Clone Block

Step 2: Click Save to view

Step 1: Navigate to Structure > Blocks

Step 2: Find View: Help us click configure link, set following properties

1. Clone Help us block view

Step 3: Click Save block button.

Step 1: Navigate to Structure > Views, click Add new view, then create Testimonials view with following settings:

Step 2: Click Continue and edit button. Next to below steps to set properties for following fields:

Step 3: Att TITLE Title click and rename the Testimonials block

Step 4: At FORMAT Format area, click Setting and set following propesties:

Step 5: At FILTER CRITERIA area, Click Add button to add Content: Body field with following properties:

Step 6: Set properties for Content: Body

Step 7:At FIELDS area, click Rearrange button and set following arrange

Step 8:At PAGE User pager area, set properties:

Step 9:At PAGE More area, set properties:

Step 10: At Advanced > OTHER area, set CSS class

Step 11: Click Save to save view

Step 1: Navigate to Structure > Blocks

Step 2: Find Testimonials click configure link, set following properties

Step 3: Click Save block button.

Step 1: Navigate to Structure > Views, find view Front page and click Clone page view. Go to Page link and set following properties:

Step 2: At Display name set name page: Home 2

Step 3: At PAGE SETTINGS Path aere set path page view

Step 4: At HEADER click Remove button to remove Global: Unfiltered text

Step 5: Click Save to save view

Step 1: Navigate to Structure > Block Find The default display of Weebpal Banner then configure:

Step 2: Click Save button

Step 1: Navigate to Structure > View click Add new view, then create Blog Quicktab view and set following properties:

Step 2: Click Continue and edit button. Next to steps below to set properties for following fields:

Step 3: Click Display name add set name block

Step 4: At FIELDS area, click Add button to add fields: Field: Image, Content : Post Date

Step 5: Set properties for Field: Image

Step 6: Set properties for Content: Post Date

Step 7: At FIELDS area, click Rearrange button and set following arrange

Step 8: Click Save to save view

Step 1: Navigate to Structure > View,find Blog Quicktab > Most popular view, Click Clone Most popular page and set following properties:

Step 2: Click Display name add set name block

Step 3: Att TITLE Title add set name title

Step 4: Click Save to save view

Step 1: Navigate to Structure > Quicktab > Add Quicktab Instance create Blog Sidebar and block with following properties:

Step 2: Click Save block button.

Step 1: Navigate to Structure > Blocks,find Blog Sidebar Block. Click configure link and block with following properties:

Step 2: Click Save block button.

Step 1: Navigate to Structure > View, find Photo Gallery : Footer Block page view. Click Clone Footer Block button and set following properties:

Step 2: Click Display name add set name block

Step 3: At FIELDS area, Click Content : Gallery link and set following properties:

Step 4: At FORMAT Format area, Click Setting link and set following properties:

Step 5: At PAGER > User pager area, click link and set following properties:

Step 6: At Advanced > OTHER area, add CSS class:

Step 7: Click Save to save view

Step 1: Navigate to Structure > Blocks,find View: Photo Gallery: Blog Block link and block with following properties:

Step 2: Click Save block button.

Step 1: Navigate to Structure > Views, click Add new view, then create Ads view with following settings:

Step 2: Click Continue and edit button. Next to steps below to set properties for following fields:

Step 3: At FIELDS area, click Add button to add fields: Field: Image, Content : Link

Step 4: Set properties for Field: Image

Step 5: Set properties for Content: Link

Step 6: At FIELDS area, click Rearrange button, Click removeContent: Title link and set following arrange

Step 7: At Advanced > OTHER area, set CSS class

Step 8: Click Save to save view

Step 1: Navigate to Structure > Blocks,find View: Ads link and block with following properties:

Step 2: Click Save block button.

Navigate to Structure > Block find Sidebar Fisrt area and configure as image below:

Step 1: Navigate to Content > Add content, find Basic page link click and set following properties:

Step 2: Click Save button

Step 1: Navigate to Content >Bloks, click Add block link, Create About Hermio block with following properties:

Step 2: Click Save button content blocks

Step 1: Navigate to Structure > Blocks,find About Hermio link, block with following properties:

Step 2: Click Save block button.

Step 1: Navigate to Structure > Views, click Add block link, Create What we do block with following properties:

Step 2: Click Continue and edit button. Next to below steps to set properties for following fields:

Step 3: At FIELD area, Click Add button to add Field: Image, Content: Body

Step 4:Set properties for Field: Image

Step 5:Set properties for Content: Body

Step 6: At FIELDS area, click Rearrange button. Click remove button Content: Title and set following arrange

Step 7: At FILTER CRITERIA area, Click Add button to add Content: Nid field with following properties:

Step 8: At HEADER area, add Global: Text area:

Step 9: At Advanced > OTHER area, add CSS class:

Step 10: Click Save to save all settings

Step 1: Navigate to Structure > Blocks,find View: About: What we do link, block with following properties:

Step 2: Click Save block button.

Step 1: Navigate to Structure > Views, click Add block link, Create Our Team block with following properties:

Step 2: Click Continue and edit button. Next to below steps to set properties for following fields:

Step 3: At FIELD area, Click Add button to add User: Picture, User: Full Name, User: Position, Field: Description, User: Email, User: Phone, Global: Fieldset, User: Facebook, User: Gplus, User: LinkedIn, User: Twitter

Step 4:Set properties for User: Picture

Step 5:Set properties for User: Full Name

Step 6:Set properties for User: Position

Step 7:Set properties for Field: Description

Step 8:Set properties for User: Email

Refer to following HTML code:

							 [field_email]
						

Step 9:Set properties for User: Phone

Refer to following HTML code:

								 [field_phone]
							

Step 10:Set properties for Global: Fieldset

Step 11:Set properties for User: Facebook

Refer to following HTML code:

Step 12:Set properties for User: Gplus

Refer to following HTML code:

Step 13:Set properties for User: LinkedIn

Refer to following HTML code:

Step 14:Set properties for User: Twitter

Refer to following HTML code:

Step 15: At FIELDS area, click Rearrange button. Click remove button User: Name and set following arrange

Step 16: At FILTER CRITERIA area, click Add button to add field User: Roles and set following properties:

Step 17: At HEADER area, add Global: Text area and set properties:

Step 18: At Advanced > OTHER area, add CSS class:

Step 19: Click Save to save all settings

Step 1: Navigate to Structure > Blocks,find View: Out Team link, block with following properties:

Step 2: Click Save view button.

Step 1: Navigate to Structure > Blocks, click Add block link. Create Featured Stories & Updates block with following properties:

Step 2: Click Save button.

Step 1: Navigate to Structure > View,find Blog view link and click Add > Page button and set following properties:

Step 2: At FIELDS area, click Add button to add fields: Field: Image, Content : Body, Content: Video, Content: Blog Type, Content: ShareThis Link, Content: Post date, Content: Link

Step 3: Set properties for Field: Image

Step 4: Set properties for Content : Body

Step 5: Set properties for Content: Video

Step 6: Set properties for Content: Blog Type

Step 7: Set properties for Content: ShareThis Link

Step 8: Set properties for Content: Post date

Step 9: Set properties for Content: Link

Step 10: At FIELDS area, click Rearrange button and set following arrange

Step 11: At PAGE SETTING Path area, click Settings and set following properties:

Step 12: At TITLE Title area, click Settings and set following properties:

Step 14: At FILTER CRITERIA area, click Rearrange button and Remove Content: Has taxonomy term (= Blog)

Step 15: At PAGE area, set User pager:

Step 16: At PAGE area, set More link:

Step 17: At HEADER click Add button to add Global: Unfiltered text set following properties:

Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc vel aliquet ante. Curabitur massa elit, pretium et tempus ultricies, dignissim vel quam.

Step 18: At Advanced > OTHER area, set CSS class

Step 19: At Display name click and rename page :

Step 20: Click Save to save view

Step 1: Navigate to Structure > View,find Blog view > Blog Full With page view link and click clone Blog Full With button and set following properties:

Step 2: Click Display name and rename the Blog Full Width block :

Step 3: At FORMAT Format area, click link and set following propesties:

Step 4: At FORMAT Setting area, click link and set following propesties:

Step 5: At FIELDS area, click Field: Image field and set properties:

Step 5: At FIELDS area, click Rearrange button and Remove Content: ShareThis Link, Content: Link and set following propesties:

Step 6: At PAGE SETTING Path area, click Settings and set following properties:

Step 7: At PAGE SETTING Menu area, click Settings and set following properties:

Step 8: At PAGE area, set User pager:

Step 9: At Advanced > OTHER area, set CSS class

Step 10: Click Save to save view

Step 1: Navigate to Structure > View, find Event view. Click Add Page button and set following properties:

Step 2: Att TITLE Title click and rename the Upcoming Events page:

Step 3: At FORMAT Format area, click Setting and set following propesties:

Step 4: At Advanced > RELATIONSHIPS area, click Add button to add fields:

Step 5: At FIELDS area, click Add button to add fields: Global: Fieldset, Field: Image, Content: Gallery, Content: Video, (term from field_type)Field: Image, Content: Post date, Content: Body, Content: Donate Counter, Content: Donate Total, Content: Donate Goal, Global: Custom text and set following propesties:

Step 6: Set properties for Field: Image

Step 7: Set properties for Global: Fieldset

Step 8: Set properties for Content: Gallery

Step 9: Set properties for Content: Video

Step 10: Set properties for (term from field_type)Field: Image

Step 11: Set properties for Content: Post Date

Step 12: Set properties for Content: Body

Step 13: Set properties for Content: Donate Counter

Step 14: Set properties for Content: Donate Total

Step 15: Set properties for Content: Donate Goal

Step 16: Set properties for Global: Custom text

Refer to following HTML code:

Step 17: At FIELDS area, click Rearrange button and set following arrange

Step 18: At PAGE SETTING Path area, click Settings and set following properties:

Step 19: At PAGE area, set User pager:

Step 20: At Advanced > OTHER area, set CSS class

Step 21: Click Save to save view

Step 1: Navigate to Content > Add content, find Basic page link click and set following properties:

Step 2: Click Save button

Step 1: Navigate to Structure > View, click Add block button and set following properties:

Step 2: Att TITLE Title click and rename title:

Step 3: At FORMAT Format area, click Setting and set following propesties:

Step 4: At FIELDS area, click Add button to add fields: Global: Fieldset, Content: Gallery, Content: Video, (term from field_type)Field: Image, Global: Fieldset, Content: Post date, Content: Donate Counter, Content: Donate Total, Content: Donate Goal, Global: Custom text and set following propesties:

Step 5: Set properties for Field: Image

Step 6: Set properties for Global: Fieldset

Step 7: Set properties for Content: Gallery

Step 8: Set properties for Content: Video

Step 9: Set properties for (term from field_type)Field: Image

Step 10: Set properties for Global: Fieldset

Step 11: Set properties for Content: Post Date

Step 12: Set properties for Content: Body

Step 13: Set properties for Content: Donate Counter

Step 14: Set properties for Content: Donate Total

Step 15: Set properties for Content: Donate Goal

Step 16: Set properties for Global: Custom text

Refer to following HTML code:

Step 17: At FIELDS area, click Rearrange button and set following arrange

Step 18: At PAGE area, set More:

Step 19: At Advanced > OTHER area, set CSS class

Step 20: Click Save to save view

Step 1: Navigate to Structure > Views, find Donation block view. Click Add page button. Next to below steps to set properties for following fields:

Step 2: Att TITLE Title click and rename the Get Involved page:

Step 3: At PAGE SETTINGS Path area , set properties:

Step 4: At FILTER CRITERIA area

Step 5: Set properties for Content: Body

Step 6: At FIELDS area, click Rearrange button and set following arrange

Step 7: At HEADER area, click Add button and set the following properties:

Step 8: At PAGE User page area , click Settings following properties:

Step 9: At FILTER CRITERIA area , click Remove button to field Content: Sticky

Step 10: At Advanced > OTHER area, add CSS class:

Step 11: Click Save button to save settings.

Step 1: Navigate to Structure > Views, find Donation block view. Click clone Block button. Next to below steps to set properties for following fields:

Step 2: At Display name click and rename the Browse More block view

Step 3: At TITLE Title click and rename the Browse More title block view

Step 4: At FORMAT Format area, click and set properties:

Step 5: At FILTER CRITERIA area

Step 6: Set properties for Content: Body

Step 7: At FIELDS area, click Rearrange button and set following arrange

Step 8: At PAGE User page area , click Settings following properties:

Step 9: At FILTER CRITERIA area , click Remove button to field Content: Sticky

Step 10: At Advanced > OTHER area, add CSS class:

Step 11: Click Save button to save settings.

Step 1: Navigate to Structure > Blocks

Step 2: Find View: Donation click configure link, set following properties

Step 3: Click Save block button.

Step 1: Navigate to Structure > Views, click Add new view, then create Shop view with following settings:

Step 2: Click Continue and edit button. Next to below steps to set properties for following fields:

Step 3: At Advanced > RELATIONSHIPS area, add Content: Product :

Step 4: At FILTER CRITERIA area, Click Add button to add Content: Image, Commerce Product: Price, Commerce Product: Add to Cart form field with following properties:

Step 5: Set properties for Content: Image

Step 6: Set properties for Product: Price:

Step 7: Set properties for Commerce Product: Add to Cart form:

Step 8: At FIELDS area, click Rearrange button and set following arrange

Step 9: At HEADER area, click Add button and set the following properties:

Step 10: At Advanced > OTHER area, add CSS class:

Step 11: Click Save button to save settings.

Step 1: Navigate to Structure > View, find Shop view click Add Page button and set following properties:

Step 2: Att Display name click and rename the Shop width sidebar page:

Step 3: Att FORMAT > Format are, click Setting and set following propperties:

Step 4 At FIELDS area and set properties for Content: Title:

Step 5: Att PAGE SETTING Path are, click link and set following propperties:

Step 6: At Advanced > OTHER area, add CSS class:

Step 7: Click Save to save view

Step 1: Navigate to Structure > View, find Shop view click Add Block button and set following properties:

Step 2: Att Display name click and rename the Most popular block:

Step 3: Att FORMAT > Format are, click Show and set following propperties:

Step 4 At FIELDS area and set properties for Content: Image, Commerce Product: Price, Content: Title

Step 5: Set properties for Content: Image

Step 6: Set properties for Commerce Product: Price

Step 7: Set properties for Content: Title

Step 8: At FIELDS area, click Rearrange button. Click link Remove: Commerce Product: Add to Cart form and set following arrange

Step 9: Att PAGER > User Pager are, click link and set following propperties:

Step 10: At Advanced > OTHER area, add CSS class:

Step 11: At SORT CRITERIA area, click Content: Post date link and set following properties:

Step 12: Click Save to save view

Step 1: Navigate to Structure > View, find Shop > Most popular block view click Clone Most popular button and set following properties:

Step 2: Att Display name click and rename the Most popular block:

Step 3: At SORT CRITERIA area, click Content: Post date link and set following properties:

Step 4: Click Save to save view

Step 1: Navigate to Structure > Quicktab > Add Quicktab Instance create Shop Sidebarand block with following properties:

Step 1: Navigate to Structure > Blocks,find Shop Sidebar Block link and block with following properties:

Step 2: Click Save block button.

Step 1: Navigate to Structure > Views, click Add block link, Create Contact information block with following properties:

Step 2: Click Continue and edit button. Next to below steps to set properties for following fields:

Step 3: At FILTER CRITERIA area, Click Add button to add Global: Custom text, Content: Body, Content: Link field with following properties:

Step 4: Set properties for Global: Custom text

Refer to the following HTML code:

Step 5: Set properties for Content: Body

Step 6: Set properties for Content: Link

Step 7: At FIELDS area, click Rearrange button and set following arrange

Step 8: At FILTER CRITERIA area, Click Add button to add Content: Nid field with following properties:

Step 9: At Advanced > OTHER area, add CSS class:

Step 10: Click Save to save all settings

Step 1: Navigate to Structure > Blocks Find View: Contact information click configure link, set following properties

Step 3: Click Save block button.

Step 1: Navigate to Content > Add content > Webform

Step 2: Click URL path settings tab, set the following properties:

Step 3: Click Save button.

Step 4: Navigate to Webform tab and Add fields:

Step 5: Click Save button.

Step 1: Navigate to Structure > Blocks, click Add block link. Create Contact Us block with following properties:

Step 2: Click Save button.

Step 1: Navigate to Structure > Views, find Shopping cart block link. Click Edit and set following properties:

Step 2: At Advanced > OTHER area, add CSS class:

Step 3: Click Save to save all settings

Step 1: Navigate to Structure > Views, find Shopping cart form link. Click Edit and set with following properties:

Step 2: At Advanced > OTHER area, add CSS class:

Step 3: Click Save to save all settings

In this section, you can change basic settings, such as the site name, slogan, e-mail address.

1. Log in to Administration site page by administrator account

2. Navigate to the Site Information page Configuration > System: Site information

3. Change site details from the view:

1. Site name
2. Slogan
3. E-mail address
4. Set Default Front page

4. Click on Save configuration to finish editing.

1. Create a new color.

Step 1: Navigate to the directory: hermio/sites/all/themes/hermio, you can find file hermio.info, open this file.

Step 2: Locate the skins[ ] arrays and add new code row:

Step 3: Save file.

Step 4: Navigate to the directory: hermio/sites/all/themes/hermio/css/colors, clone a folder, then rename it "new_color"

Step 5: new_color folder includes images folder and style.css file.

Now, you can style new color for theme by modifying style.css file.

2. Create a new background.

Step 1: Navigate to the directory: hermio/sites/all/themes/hermio, you can find file, open file hermio.info

Step 2: Locate the backgrounds[ ] arrays and add new code row:

Step 3: Save file.

Step 4: Move your background image into the directory: hermio/sites/all/themes/hermio/images

Step 5: Navigate to the directory: hermio/sites/all/themes/hermio/css, open file base.css, and add new code row:

Step 6: Save file.

3. Configuration.

Step 1: Log into website by administrator account.

Step 2: Go to Appearance find hermio 7.32, click on Settings

Step 3: At CONFIGS area, select one of options for Layout, Skin, Background to set default, (e.g: New Color), and at TOGGLE DISPLAY area, check Show Skins Menu option if you want to display Skins menu on front-end pages.

This section guides you how to have multiple languages for your site. Hermio Theme supports both Left to Right and Right to Left languages.

Step 1: Navigate to Configuration > Regional and Language > Languages then add new language.

Step 2: Check to enable and set default language

Step 3: Save configuration