Latest From My Blog


Understanding the Blogger Layout and its page elements

Today we are going see about Blogger Layout and its page elements which is used to design your blog very easy manner. The blogger Layout is made up of “Section and Elements”.  Using this option you can add sidebar, footer, picture, HTML/JAVASCRIPT, Blogroll, etc. in your blogger template.
The <body> section of the layouts template is made up of sections and widgets.
Hope you will get some idea about Blogger Layout and its page elements after viewing above images. We will see detailed about the same below,

SECTION

Each section in your template has an opening and a closing tag, looking something like this:
<b:section id='header' class='header' maxwidgets="1" showaddelement="no">
</b:section>
A <b:section> tag can have the following attributes:
1.     id - (Required) A unique name, with letters and numbers only.
2.     class - (Optional) Common class names are 'navbar,' 'header,' 'main,' 'sidebar,' and 'footer.' If you switch templates later, these names help Blogger determine how best to transfer over your content. However, you can use different names, if you like.
3.     maxwidgets - (Optional) The maximum number of widgets to allow in this section. If you don't specify a limit, there won't be one.
4.     showaddelement - (Optional) Can be 'yes' or 'no,' with 'yes' as the default. This determines whether the Page Elements tab will show the 'Add a Page Element' link in this section.
5.     growth - (Optional) Can be 'horizontal' or 'vertical,' with 'vertical' as the default. This determines whether widgets within this section are arranged side-by-side or stacked.
A section can contain widgets; it can't contain other sections or other code.

Widget

You can add elements in the existing sections which is available. You can easily add Page Elements by clicking ‘’Add a Gadget “link like below,
A widget is represented by a single tag, some examples of widgets (one for a page header and one for a list) are:
<b:widget id="header" type='HeaderView' locked="yes"/>
<b:widget id="myList" type='ListView' locked="no" title="My Favorite Things"/>
<b:widget id=”BlogArchive1” locked=”false” mobile=”yes” title=”Blog Archive” type=”BlogArchive”/>
A widget may have the following attributes:
1.     id - (Required) May contain letters and numbers only, and each widget ID in your template should be unique. A widget's ID cannot be changed without deleting the widget and creating a new one.
2.     type - (Required) Indicates what kind of a widget it is, and should be one of the valid widget types listed below.
3.     locked - (Optional) Can be 'yes' or 'no,' with 'no' as the default. A locked widget cannot be moved or deleted from the Page Elements tab.
4.     title - (Optional) A display title for the widget. If none is specified, a default title such as 'List1' will be used.
5.     pageType - (Optional) Can be 'all,' 'archive,' 'main,' or 'item,' with 'all' as the default. The widget will display only on the designated pages of your blog. (All widgets display on the Page Elements tab, regardless of thier pageType.)
6.     mobile - (Optional) Can be 'yes', 'no,' or ‘only’ with 'default' as the default. This decides if the widget will be displayed on mobile or not. Only Header, Blog, Profile, PageList, AdSense, Attribution will be displayed on mobile when the mobile attribute is 'default.'
The types of widgets you can specify are:
1.     BlogArchive
2.     Blog
3.     Feed
4.     Header
5.     HTML
6.     SingleImage
7.     LinkList
8.     List
9.     Logo
10.  BlogProfile
11.  Navbar
12.  VideoBar
13.  NewsBar
We will see above widgets in-depth in my further tutorial.

Understanding the Blogger Layout

Blogger Custom template installation
Today (04-Oct-2014) we are going to see about Blogger Custom template installation. As I mentioned in my earlier article about Blogger TemplateCustomization, template design playing important role in Google AdSense because it can catch an eye of the visitor and to convert the visitor into a regular reader. So your template must look enough attractive and easy to navigate so that it can connect with your blogs reader.
Read : Create Your Blog With Easy Steps
Read : Customize your blogger template  
I suggest below 2 URL to download blogger template,
1.     http://www.blogtipsntricks.com/
2.     http://www.templatetrackers.com/
Or else please type Best Blogger Template Free Download in Google and search your best template which suites for your blog and download the same (Template file should be in XML formatted).
STEP – 1
Login in to Blogger dashboard
STEP - 2
Go to the Template Section --> Backup/Restore
STEP – 3
Click on Download Template to back up your previous template
STEP - 4
Upload a template file which you have downloaded (Template file should be in XML formatted)
STEP - 5
Click on upload button to install your template

Hope the template installed successfully for your blog.
Thank you

Blogger Install Custom Template

Blogger Template Customization
Blogger is a very good platform to explore your ideas in the web world. Here I publish this article about customizing blogger template.
Template design playing important role in Google AdSense because it can catch an eye of the visitor and to convert the visitor into a regular reader. So your template must look enough attractive and easy to navigate so that it can connect with your blogs reader.
STEP -1
Open Blogger Dashboard
STEP – 2
Click on Template tab which is left side bar
STEP -3
Before edit take backup your original template code
STEP – 4
You can customize your blogger template design below and finally save this 
Read : Blogger Install Custom Template
 If you have any queries just comment.



How to Customize Blogger Template

How to Create Blog Step by Step

Blogger is an online service owned by Google. It is one of the easiest methods of creating and publishing a blog for free. If you are unfamiliar with the service, this article will teach you how to set up an account and create a blog on Blogger.com.
Create blog on Blogger.com  
You can easily create Google’s Blogspot using following steps,
STEP – 1
Navigate to www.blogger.com in your browser

STEP – 2
Sign in using your Gmail account if you have, or else please create an account in Gmail

STEP – 3
Click on the New Blog in the blogger home page

STEP – 4

With very easy four steps you have created blogger successfully!


POST YOUR FIRST ARTICLE IN YOUR BLOG

STEP -1
Click on the New Post button to post new article in your blog


STEP – 2
You can create new blog posts and edit posts from under the “New Post” tab


Add an Image in your Post

Add Video in your post


Hope finally your Blog and your first article created successfully Thank you.

How to Create Blog Step by Step Tutorial

Linux Connect
Executing following command in Linux terminal you can directly access your box.
ssh -i KEY File username@publicDNSname.amazonaws.com
ssh 
-i keypair.pem ubuntu@publicDNSname.amazonaws.com

Windows connect using Putty
PuTTY is a free and open source terminal emulator application which can act as a client for the SSH, Telnet, rlogin, and raw TCP computing protocols and as a serial console client. 

Step -1
First you have to download Putty.exe and PuttyGen.ext into your PC click here and download

Step 2
Run PuttyGen.exe click Conversions -> Import Key.

Step 3
Choose keypair.pem the Key Pair.

Step 4
In Parameters select Type of Key Generate SSH-1(RSA). Click Save private key.Same directory Puttygen will generate .ppk file (private key).

Step 5
Now run Putty.exe host name give Elastic IP or Public DNS name(If no elastic IP) and choose connection type SSH

Step 6
Authentication with private key. 
Category -> Connection -> SSH -> Auth browse and select .ppk file the click Open button.

Step 7
Instance cloud connected successfully. 

Execute following commands.
Update the Package
sudo apt-get update
Install Apache2
sudo apt-get install apache2
Install PHP5
sudo apt-get install php5
sudo 
apt-get install 
libapache2-mod-php5
Install MySQL
sudo apt-get install mysql-server libapache2-mod-auth-mysql php5-mysql
Install PhpMyAdmin
sudo apt-get install phpmyadmin
Restart Apache2
sudo /etc/init.d/apache2 restart
Now your web services is ready. You can upload your files into /var/www/ directory using FTP.
Access http://ElasticIP/. It works!
FileZilla - File Uploads
Using the open source FTP tool you can upload files into Amazon EC2 instance box. Download here and install into your PC.
Step 1
Select File-> Site Manager

Step 2
Give host name as your instance box Elastic IP and select Server Type SFTP-SSH File Transfer Protocol. Click OK not Connect

Step 3
Adding private key for instance cloud authentication. Edit -> Settings -> Connectin -> SFTP click Add keyfile button to browsed and choose existing .ppk file. Eg:keypair.ppk

Step 4
Now Got File-> Site Manager click Connect button.

Instance connected. Now you can upload files from local PC to Amazon EC2 Instance Cloud /var/www/ directory.

Connect Amazon instance cloud to Linux and Windows

+