Sevida is the premium responsive blog and magazine template for Blogger fans. This template shows you how cool and flexible Blogspot. Bloggersstand brings the full documentation of the sevida v2.4.2 for our precious readers,Now you can easily edit the sevida v2.4.2 lot's of visitors asking everyday for the settings and customizing the template,so finally we thought to release the full tutorial + documentation of sevida V2.4.2.After this tutorial you still face any problem you can ask us anytime.Enjoy the release of the documentation.
How To Install + Edit + Customize Sevida V2.4.2 Responsive Blogger Template
- Theme Options Area (this area to change default option)
- Top Menu Area
- Top Social Link area
- Header Area
- Top Ads Area (Recommended 720 x 90)
- Main Menu Area
- Mega Menu Links Content area (this widget will show if you add -links to main menu)
- News Ticker Area
- Top Featured Post Area
- Magazine Widget Area (this just show on Homepage and section for Recent post by Label widget)
- Right Sidebar Area
- Sidebar Tab Widget Area
- Place to add ads. Code from Ads Inside Post widget will show if you are add [ads-post] in your article
- Post Label area (this label will show on Latest Post title)
- This to control your blog comment system ([blogger][facebook][disqus])
- Put yours disqus shortname here if you want to add disqus comments
- Yours flickr ID here if you want to add flickr badge
- Footer Area
- Author Profile Area
- Manual Image Area (all Image widget from this area will show if you add manualslide in yours HTML widget)
- This will enable google adsense Javascript, Just "y" to enable it and "n" to disable
Theme Options:
1. Translator Widget:
On "New Site Name" fild1 field add the default language
And on "New Site URL" fild2 field add your language.
/*------ English To Arabic ------*/2. Default is Boxed Style. If you want to change it to Full Width style just add this "y" and if you to make if Boxed Style again just change it to "n"
fild1 : Popular Posts
fild2 : المقالات الشائعة
/*------ English To French ------*/
fild1 : Popular Posts
fild2 : Articles populaires
/*------ English To Allemand ------*/
fild1 : Popular Posts
fild2 : Beliebte Beiträge
/*------ English To Espagnol ------*/
fild1 : Popular Posts
fild2 : Puestos Popular
3. This to change other Default Setting in this theme sumlength,fixMenu recentpost, recentcomment, related, featuredpost, random and etc.
On "New Site Name" field Property. ex: recentpost
And on "New Site URL" field max number. ex: 6
| Property | Description | Default |
|---|---|---|
| sumlength | this to change max summary length on Main Recent Post | 200 |
| fixMenu | if you want to enable or disable fixmenu effect on main menu. Support value "y" or "n" | y |
| monthName | If you want to change month name on post | Jan,Feb,Mar ,Apr,May,Jun, Jul,Aug,Sep, Oct,Nov,Dec |
| FullmonthName | if you want to change month name on date and time (Top Menu) | January,February, March,April,May,June,July, August,September,October, November,December |
| stickyMenu | if you want do enable or disable sticky Sidebar. Support value "y" or "n" | y |
| sliderspeed | if you want to change slider speed. (in milisecond) | 5000 |
| navipostpage | if you want to change Page Navigation number | 20 |
| rcadminBlog | hide Admin Comment on recentcomment. Support value "y" or "n" | n |
| shideauthor | to show or hide author name on Widget by Labels. Support value "y" or "n" | n |
| hideLatest | this to hide Main Latest Post in home | n |
| cseID | If you want to add Google Custom Search Engine (Google CSE) effect to top menu search. Just add yours Google CSE code like this: | 013487895970210376374:11mzjaatn8s |
| hideEmo | this to show or hide Emoticon Effect in Blogger comment and Recent comment widget. Support value "y" or "n" | n |
| homelist | this to change Main Latest Post style to List style. Support value "y" or "n" | n |
| disabletime | this to disable date and time on Top menu. Support value "y" or "n" | n |
| homePageNavi | this to change Main Latest Post Ajax Load More to Page Navigation.Support value "y" or "n" | n |
| fbappsid | this to change Facebook Apps ID | 487910834570906 |
| fblang | this to change Facebook Language | en_US |
| dajaxPageNavi | this to disable ajax effect on Page Navigation. Support value "y" or "n" | n |
| srctext | this to change text inside the Menu Search box | Type and hit enter to search... |
| ntext | this to change "Next" text in blog post Navigation | Next |
| ptext | this to change "Previous" text in blog post Navigation | Previous |
| mtext | this to change "More" text | More |
| lmtext | this to change "Load More Post" text | View More About |
| reltext | this to change "Related Post" text in Related Post Widget | Related Post |
| rectext | this to change "Recent Post" text in Related Post Widget | Recent Post |
| tweettext | If you want to change text "Tweet" text in Social button | Tweet |
| liketext | If you want to change text "Like" text in Social button | Like |
| sharetext | If you want to change text "Share" text in Social button | Share |
| readmoretext | this to change "Read more »" text | Read more » |
| twitterauthor | If you want to change twitter author when click Tweet button | satankMKR |
| relstyle | If you want to Related Post style. Support value: "carousel", "simple" and "fbig" | Carousel |
| hreview | If you want to hide review value in Recent Post and Recent Post widget by Label. Support value: "n" and "y" | n |
| jsonload | If you want to change JSON feed load from widget by Label. Support value: "default" and "summary" | default |
| hexcerpt | If you want to hide excerpt text below the title. Support value: "n" and "y" | n |
| firstthumb | this to change First thumbnail Size on fbig, column2 widget | s450 |
| thumb | this to change thumbnail size | w90-h65-c |
| sliderthumb | this to change slider thumbnail size | s800 |
| dajaxsrc | this to disable ajax search effect. Support value "y" or "n" | n |
| featpost | if you want to make first image in blog post become Featured Image. Support value y or n | n |
| topbreakline | If you to show breakline below post title. Support value y or n | n |
| bottombreakline | If you to show breakline in end post. Support value y or n | n |
| autoplay | If you want to make Related Post (carousel style autoplay). Support value y or n | n |
| topbreaklineload | This to change top breakline load data. Support value "related", "recent" and "random" | Recent |
| bottombreaklineload | This to change bottom breakline load data. Support value "related", "recent" and "random" | Recent |
| recentpost | this to change max item show in recentpost widget | n |
| randompost | this to change max item show in randompost widget. | 4 |
| featuredpost | this to change max item show in featuredpost widget. | 4 |
| recentcomment | this to change max item show in recentcomment widget. | 5 |
| fbig1 | this to change max item show in fbig1 widget. | 5 |
| fbig2 | this to change max item show in fbig2 widget. | 5 |
| gallery1 | this to change max item show in gallery1 widget. | 10 |
| gallery2 | this to change max item show in gallery2 widget. | 5 |
| gallery3 | this to change max item show in gallery3 widget. | 6 |
| column1 | this to change max item show in column1 widget. | 5 |
| column2 | this to change max item show in column2 widget. | 5 |
| newsticker | this to change max item show in newsticker widget. | 9 |
| slider | this to change max item show in slider widget. this for all slider. (slider1 and slider2) | 5 |
| carousel1 | this to change max item show in carousel1 widget | 9 |
| carousel2 | this to change max item show in carousel2 widget. | 9 |
| related | this to change max item show in related widget. | 9 |
| video | this to change max item show in video widget. | 6 |
| featured1 | this to change max item show in featured1 widget. | 8 |
| featured2 | this to change max item show in featured2 widget. | 10 |
| featured3 | this to change max item show in featured3 widget. | 10 |
| featured4 | this to change max item show in featured4 widget. | 5 |
| featured5 | this to change max item show in featured5 widget. | 7 |
| animatedpost | this to change max item load if widget have animated effect. | 9 |
| list | this to change max item show in list widget. | 6 |
| hot | this to change max item show in hot widget. | 3 |
| timeline | this to change max item show in timeline widget. | 5 |
| blogpost | this to change max item show in blogpost widget. | 4 |
| halfpost | this to change max item show in halfpost widget. | 4 |
| bigpost | this to change max item show in bigpost widget. | 4 |
| simplepost | this to change max item show in simplepost widget. | 4 |
| disquscomment | this to change max item show in disquscomment widget. | 4 |
| flickrbadge | this to change max item show in flickrbadge widget. | 8 |
Default Setting
After installing the theme, this it the minimum setting to make all widget works fine in this themes.
Embedded Comment
This to make comment area like the Demo and make Emoticon show
- On Blogger Dashboard Click Setting.
- Click Posts and Comments
- in Comment Location Choose Embedded
- Then Click Save settings.
Blog Feed
This to make recent comment, Search Result, Featured Post, and Post by Label work fine
- On Blogger Dashboard Click Setting.
- Click Other
- in Site Feed Allow Blog Feed Choose Full Or Short
- Then Click Save settings.
Points To Remember:
- If yours post have image uploaded on blogspot you can choose SHORT. but if yours post just have image from third party image hosting you must choose Full
- Blogger feed must be not redirect to other feed site like Feedburner
- Your's blog or website not Private.
Configuration Blog Posts
This default setting to make yours website like the demo
- On Blogger Dashboard Click Layout.
- On Blog Posts Widget Click Edit
- Configure like image below
- Then Click Save.
Setting the Menu:
Top Menu:To Edit Top Menu in this theme you can follow this step:
1.First Go to Dashboard > Layout > Edit Top Menu > Configure Link List
2.On "New Site Name" field add your menu title like as this :
Menu Title
3.And on "New Site URL" field add your url address.
4.To add Sub Menu just add _ before yours Menu Title
_Sub Menu
5.To add Sub Menu just add __ before yours Menu Title
__Sub Sub Menu
6.To add icon in top menu you can add code like this: <i class="fa fa-ICON_NAME"></i> before or after menu name eg:
<i class="fa fa-facebook"></i>Menu Title
_<i class="fa fa-twitter"></i>Sub Menu
__<i class="fa fa-pinterest"></i>Sub Sub Menu
Note: You can get Fontawesome icons by visiting : http://fontawesome.io/icons
To Edit Top Menu in this theme you can follow this step:
1.First Go to Dashboard > Layout > Edit Main Menu > Configure Link List
2.On "New Site Name" field add your menu title and Sub title like as this :
Menu Title [Sub Title]
3.And on "New Site URL" field add your url address.
4.To add Sub Menu just add _ before yours Menu Title
_Sub Menu
5.To add Sub Sub Menu just add __ before yours Menu Title.
__Sub Sub Menu
6.To add icon in top menu you can add code like this: <i class="fa fa-ICON_NAME"></i> before or after menu name.
<i class="fa fa-facebook"></i>Menu Title
_<i class="fa fa-twitter"></i>Sub Menu
__<i class="fa fa-pinterest"></i>Sub Sub Menu
Note: You can get Fontawesome icons by visiting : http://fontawesome.io/icons
To add a block style "-links" simply on "New Site Name" field add this
-links
Note This will load content from "Mega Menu Links Contents"
b.) Mega Menu (Tabs style)3.And on "New Site URL" field add your url address.
4.To add Sub Menu just add _ before yours Menu Title
_Sub Menu
5.To add Sub Menu just add __ before yours Menu Title
__Sub Sub Menu
6.To add icon in top menu you can add code like this: <i class="fa fa-ICON_NAME"></i> before or after menu name eg:
<i class="fa fa-facebook"></i>Menu Title
_<i class="fa fa-twitter"></i>Sub Menu
__<i class="fa fa-pinterest"></i>Sub Sub Menu
Note: You can get Fontawesome icons by visiting : http://fontawesome.io/icons
Setting the Main Menu
To Edit Top Menu in this theme you can follow this step:
1.First Go to Dashboard > Layout > Edit Main Menu > Configure Link List
2.On "New Site Name" field add your menu title and Sub title like as this :
Menu Title [Sub Title]
3.And on "New Site URL" field add your url address.
4.To add Sub Menu just add _ before yours Menu Title
_Sub Menu
5.To add Sub Sub Menu just add __ before yours Menu Title.
__Sub Sub Menu
6.To add icon in top menu you can add code like this: <i class="fa fa-ICON_NAME"></i> before or after menu name.
<i class="fa fa-facebook"></i>Menu Title
_<i class="fa fa-twitter"></i>Sub Menu
__<i class="fa fa-pinterest"></i>Sub Sub Menu
Note: You can get Fontawesome icons by visiting : http://fontawesome.io/icons
Add Mega Menu
a.) Mega Menu (block style "-links")To add a block style "-links" simply on "New Site Name" field add this
-links
Note This will load content from "Mega Menu Links Contents"
-mtab/Label_1,Label_2,Label_3,Label_4
c.) Mega Menu (Grip style)
-grip/LabelName or recent or random
d.) Mega Menu (First Big Style)
To add a Mega Menu First Big Style simply on "New Site Name" field add this
-mbig/LabelName or recent or random
Complete Menu will look like this:
Note: Subtitle just work in Main Menu Widget.
Setting the Social Icons:
To Edit Social Icon in this theme you can follow this step:- First Go to Dashboard > Layout > Edit Social Link > Configure Link List
- On "New Site Name" field add your social name : facebook, twitter, rss, dribbble, google, pinterest, linkedin, youtube, vimeo, skype, deviantart, flickr, stumbleupon, tumblr, delicious, digg, lastfm, wordpress, instagram, apple, dropbox, behance, reddit.
- And on "New Site URL" field add your social url adress.
- Then click Save.
Setting Meta Tag (Facebook,Twitter,Google+)
1.On Blogger Dashbord Click Template
2.Click Edit HTML
3.Scroll down and Find this Code :
<meta content='YOUR KEYWORDS HERE' name='keywords'/>4.Change YOUR KEYWORDS HERE with yours website keywords.
<!-- Metadata Facebook -->
<meta expr:content='data:blog.title' property='og:site_name'/>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<meta content='article' property='og:type'/>
<meta expr:content='data:blog.url' property='og:url'/>
<meta content='100002549773049' property='fb:admins'/>
<!-- Metadata Twitter -->
<meta name='twitter:card' value='summary'/>
<meta expr:content='data:blog.pageTitle' name='twitter:title'/>
<meta content='@publisher_handle' name='twitter:site'/>
<meta content='@author_handle' name='twitter:creator'/>
Note: meta tag keywords no more use to improve the SEO. because now meta tag keywords just support for bing search engine.
5.Change 100002549773049 with yours Facebook Admin ID
6.Change @publisher_handle with yours twitter ID/Website twitter ID and change @author_handle with yours twitter ID too.
Note: Before your cards show on Twitter, you must first have your domain approved. Fortunately, it's a super-easy process. After you implement your cards, simply enter your sample URL into the validation tool. After checking your markup, select the "Submit for Approval" button. Visit : https://dev.twitter.com/docs/cards/validation/validator for testing and approval.
Settings Summary Length,Comments,Author Profile and etc:
Summary Length
- On Blogger Dashbord Click Layout
- on Theme Option Area click Edit on Change Default Setting
- In New Site Name sumlength and New Site URL add yours number value. Ex: if you want to make 200 length just add that.
- Then Click Add Link then Click Save.
Page Navigation Number:
- On Blogger Dashbord Click Layout
- on Theme Option Area click Edit on Change Default Setting
- In New Site Name navipostpage and New Site URL add yours number value. Ex: if you want to make 10 post show. Just add it
- Then Click Add Link then Click Save.
Main Latest List Style
- On Blogger Dashbord Click Layout
- on Theme Option Area click Edit on Change Default Setting
- In New Site Name homelist and New Site URL add y.
- Then Click Add Link then Click Save.
Main Latest Page Navigation
- On Blogger Dashbord Click Layout
- on Theme Option Area click Edit on Change Default Setting
- In New Site Name homePageNavi and New Site URL add y.
- Then Click Add Link then Click Save.
Recent Comments (Hide Admin )
- On Blogger Dashbord Click Layout
- on Theme Option Area click Edit on Change Default Setting
- In New Site Name rcadminBlog and New Site URL add y.
- Then Click Add Link then Click Save.
JSON Search result
- On Blogger Dashbord Click Layout
- on Theme Option Area click Edit on Change Default Setting
- In New Site Name dajaxsrc and New Site URL add y.
- Then Click Add Link then Click Save.
Google CSE
- On Blogger Dashbord Click Layout
- on Theme Option Area click Edit on Change Default Setting
- In New Site Name cseID and New Site URL add yours google CSE ID code.
- Then Click Add Link then Click Save.
Emoticon
- On Blogger Dashbord Click Layout
- on Theme Option Area click Edit on Change Default Setting
- In New Site Name hideEmo and New Site URL add y.
- Then Click Add Link then Click Save.
Comment Setting
1.On Blogger Dashbord Click Layout
2.Click Edit on Comments system widget and inside it add your comments systems you need in this way
[blogger] for blogger comments
[facebook] for facebook comments
[disqus] for disqus comments
you can add one system, two or three as you like and with arrangement you need for example
[facebook]
[facebook][blogger]
[blogger][facebook]
[disqus][facebook][blogger]
3.Then Click Save.
Setting to make Disqus Comment
- On Blogger Dashbord Click Layout
- Click Edit on Disqus Shortname widget and inside it add your disqus Shortname
- Then Click Save
Get Disqus Shortname
- Access your Disqus Admin and choose Settings
- Then scroll down to Site Identify, you will see your username (shortname).
Author Profile
1.On Blogger Dashbord Click Layout
2.Click Edit on Author Profile Area and inside it add code like this:
{picture#YOUR_PROFILE_PICTURE_URL}3.Then Click Save
YOUR_PROFILE_DESCRIPTION
{facebook#YOUR_SOCIAL_PROFILE_URL}
{twitter#YOUR_SOCIAL_PROFILE_URL}
{google#YOUR_SOCIAL_PROFILE_URL}
{pinterest#YOUR_SOCIAL_PROFILE_URL}
{youtube#YOUR_SOCIAL_PROFILE_URL}
{instagram#YOUR_SOCIAL_PROFILE_URL}
4.If you have want add more Author Profile Just add New HTML widget on Author Profile Area and fill like above.
Flickr ID
- On Blogger Dashbord Click Layout
- Click Edit on Flickr User ID widget and inside it add your flickr ID
- Then Click Save
Widgets Top Featured, Slider, Column, Social Counter and etc.
News Ticker
1.On Blogger Dashbord Click Layout
2.Click Edit on Breaking News widget and inside it add code like this:
[recent][newsticker]
if you want newsticker load random. code like this.
[random][newsticker]
if you want newsticker load from specific Label/Category. Ex. Load from Technology code like this.
[Technology][newsticker]
Top Featured Post
1.On Blogger Dashbord Click Layout
2.Click Edit on Top Featured widget and inside it add code like this:
Available Featured Type : featured1, featured2, featured3, featured4, featured5
Add code like this:
[Your_Labels_Here][featured1]
Example (Show Featured Post from Multiple Labels "Music,Technology,Fashion,Trends")
[Music,Technology,Fashion,Trends][featured1]
Example (Show Featured Post from Recent Post)
[recent][featured2]
Example (Show Featured Post from Random Post)
[random][featured2]
Note: Maximun Labels Support for Multiple Labels is 4
Note: Random and Multiple Labels need more time to load
3.Then Click Save.
Social Counter
1.On Blogger Dashbord Click Layout then click Edit in Social Counter Widget
2.On "New Site Name" fild1 field add Social Name (Social Counter)
3.And on "New Site URL" fild2 field add your Social Url.
Example : Note Only this Socials Supported !
facebook [1.1k]4. Then Click Save.
twitter [2k]
google [250]
rss [590]
youtube [3.5k]
dribbble [8.2m]
instagram [732]
pinterest [210]
linkedin [2.56k]
vimeo [300]
skype [568]
deviantart [6.4k]
flickr [900]
stumbleupon [561]
tumblr [5.4m]
delicious [86]
digg [789]
lastfm [652]
wordpress [1.5k]
apple [60]
dropbox [980]
behance [366]
reddit [10]
Widget by Labels
First Big 1
1.On Blogger Dashbord Click Layout2.Click Add a Gadget on Magazine Widget Area
3.Choose HTML/Javascript
4.Copy this Code:
[Yours_Label_Name][fbig1]
ex: load from Music label.
[Music][fbig1]
Note: "Yours_Label_Name" is yours Labels you want to load.
Note: you can change "Yours_Label_Name" with "recent" if you want load latest post or "random" if you want load Random post.
If you want load from other Blog. code look like this:
[Yours_Label_Name][fbig1][Other_URL]
Ex: Load Tecnology from otherblog.com
[Tecnology][fbig1][http://otherblog.com]
if you want change Widget title color. code like this
[Yours_Label_Name][fbig1][Hexcolorcode]
ex: width this color: #8ED557
[Yours_Label_Name][fbig1][#8ED557]
if you want add Animated Effect. Code like this:
[Yours_Label_Name][fbig1 animated]
5. Then Click Save.
First Big 2
1.On Blogger Dashbord Click Layout
2.Click Add a Gadget on Magazine Widget Area
3.Choose HTML/Javascript
4.Copy this Code:
[Yours_Label_Name][fbig2]
ex: load from Music label.
[Music][fbig2]
Note: "Yours_Label_Name" is yours Labels you want to load.
Note: you can change "Yours_Label_Name" with "recent" if you want load latest post or "random" if you want load Random post.
If you want load from other Blog. code look like this:
[Yours_Label_Name][fbig2][Other_URL]
Ex: Load Tecnology from otherblog.com
[Tecnology][fbig2][http://otherblog.com]
if you want change Widget title color. code like this
[Yours_Label_Name][fbig2][Hexcolorcode]
ex: width this color: #8ED557
[Yours_Label_Name][fbig2][#8ED557]
5. Then Click Save.
Column 1
1.On Blogger Dashbord Click Layout
2.Click Add a Gadget on Magazine Widget Area
3.Choose HTML/Javascript
4.Copy this Code:
[Yours_Label_Name][column1]
ex: load from Music label.
[Music][column1]
Note: "Yours_Label_Name" is yours Labels you want to load.
Note: you can change "Yours_Label_Name" with "recent" if you want load latest post or "random" if you want load Random post
If you want load from other Blog. code look like this:
[Yours_Label_Name][column1][Other_URL]
Ex: Load Tecnology from otherblog.com
[Tecnology][column1][http://otherblog.com]
if you want change Widget title color. code like this
[Yours_Label_Name][column1][Hexcolorcode]
ex: width this color: #8ED557
[Yours_Label_Name][column1][#8ED557]
if you want add Animated Effect. Code like this:
[Yours_Label_Name][column1 animated]
5. Then Click Save.
Column 2
1.On Blogger Dashbord Click Layout
2.Click Add a Gadget on Magazine Widget Area
3.Choose HTML/Javascript
4.Copy this Code:
[Yours_Label_Name][column2]
ex: load from Music label.
[Music][column2]
Note: "Yours_Label_Name" is yours Labels you want to load.
Note: you can change "Yours_Label_Name" with "recent" if you want load latest post or "random" if you want load Random post
If you want load from other Blog. code look like this:
[Yours_Label_Name][column2][Other_URL]
Ex: Load Tecnology from otherblog.com
[Tecnology][column2][http://otherblog.com]
if you want change Widget title color. code like this
[Yours_Label_Name][column2][Hexcolorcode]
ex: width this color: #8ED557
[Yours_Label_Name][column2][#8ED557]
if you want add Animated Effect. Code like this:
[Yours_Label_Name][column2 animated]
5.Then Click Save.
Hot Post
1.On Blogger Dashbord Click Layout
2.Click Add a Gadget on Magazine Widget Area
3.Choose HTML/Javascript
4.Copy this Code:
[Yours_Label_Name][hot]
ex: load from Music label.
[Music][hot]
Note: "Yours_Label_Name" is yours Labels you want to load.
Note: you can change "Yours_Label_Name" with "recent" if you want load latest post or "random" if you want load Random post
If you want load from other Blog. code look like this:
[Yours_Label_Name][hot][Other_URL]
Ex: Load Tecnology from otherblog.com
[Tecnology][hot][http://otherblog.com]
if you want change Widget title color. code like this
[Yours_Label_Name][hot][Hexcolorcode]
ex: width this color: #8ED557
[Yours_Label_Name][hot][#8ED557]
5.Then Click Save.
That's it Folks !!