A.Softs Inc

Blogger How To: Center Your Header

<h1 class="post entry-title" itemprop="headline" style="-webkit-text-stroke-width: 0.2px; background-color: #fafafa; border: 0px; font-family: Vidaloka; font-stretch: normal; font-weight: 400; letter-spacing: -0.03em !important; line-height: 1em; margin: 10px 0px 20px; padding: 0px;">
<span style="font-size: x-large;">Blogger How To: Center Your Header</span></h1>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEia6nrF_rwOPYcnKAWj0o4BVCdDChE0F7t6EhxIU-eIGUEU_Vv72FCRn_kgS7ChhGjvxnrH4F8qbhCYwr8C46LWytKKo7jg3Jq9KOOJdgE-ZmrUA48pw-nIzgfpzXiMaK32b7eogoPBoXk/s1600/center-blogger-header-copy.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Center-Your-Header" border="0" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEia6nrF_rwOPYcnKAWj0o4BVCdDChE0F7t6EhxIU-eIGUEU_Vv72FCRn_kgS7ChhGjvxnrH4F8qbhCYwr8C46LWytKKo7jg3Jq9KOOJdgE-ZmrUA48pw-nIzgfpzXiMaK32b7eogoPBoXk/s640/center-blogger-header-copy.jpg" title="Center-Your-Header" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Center-Your-Header</td></tr>
</tbody></table>
<div style="text-align: center;">
<span style="color: magenta; font-family: Trebuchet MS, sans-serif; font-size: large;">Like Us On Facebook To View More And Unlock</span></div>
<div style="text-align: center;">
<span style="color: magenta; font-family: Trebuchet MS, sans-serif; font-size: large;"><br /></span></div>
<br />
<article id="default-usage">
 <div class="to-lock" style="display: none;">
<div style="text-align: left;">
<span style="background-color: #fafafa; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px;">Sometimes all you want is a quick fix. You’ve uploaded your Blogger header on the Layout page but it’s aligned to the left. You want it centered horizontally over the content section of your blog instead. Here is how to easily do that!</span></div>
<div style="text-align: left;">
<div style="background-color: #fafafa; border: 0px; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px; margin-bottom: 18px; margin-top: 8px; padding: 0px;">
1. In Blogger, go to <strong style="border: 0px; margin: 0px; padding: 0px;">Template</strong> ><strong style="border: 0px; margin: 0px; padding: 0px;">Customize</strong></div>
<div style="background-color: #fafafa; border: 0px; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px; margin-bottom: 18px; margin-top: 8px; padding: 0px;">
2. Click on the <strong style="border: 0px; margin: 0px; padding: 0px;">Advanced</strong> tab then scroll to the bottom of the second menu and choose <strong style="border: 0px; margin: 0px; padding: 0px;">Add CSS</strong>.</div>
<div style="background-color: #fafafa; border: 0px; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px; margin-bottom: 18px; margin-top: 8px; padding: 0px;">
3. Copy and paste this code into the text box (click then press CTRL + C to copy, then CTRL + V to paste):</div>
<pre style="background-color: white; border: 1px solid rgb(238, 238, 238); color: #141414; font-size: 13px; line-height: 23.3999996185303px; margin-bottom: 30px; padding: 10px; white-space: pre-wrap; word-wrap: break-word;">#header-inner {text-align:center !important;} #header-inner img {margin: 0 auto !important;}</pre>
<div style="background-color: #fafafa; border: 0px; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px; margin-bottom: 18px; margin-top: 8px; padding: 0px;">
That’s it! Done like dinner.</div>
</div>
</div>
</article>

Blogger How To: Center Your Header

AyanKhan 0 Blogger Tricks, Blogger Tutorials, Blogging 11:51:00

Blogger How To: Center Your Header Center-Your-Header Like Us On Facebook To View More And Unlock Sometimes all you want is a quick fix. You’ve uploaded your Blogger header on the Layout page but it’s aligned to the left. You want it centered hori… Read more »

12Jul2015

Blogger How To: Add New Pages or Tabs

<h2 style="-webkit-text-stroke-width: 0.2px; background-color: #fafafa; border: 0px; font-family: Vidaloka; font-stretch: normal; letter-spacing: -0.03em !important; line-height: 1em; margin: 10px 0px 20px; padding: 0px; text-align: left;">
<span style="color: magenta; font-size: x-large; font-weight: normal;">Blogger How To: Add New Pages or Tabs</span></h2>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjri93lsHPtbiL35IfudbSqjWUhr9Na_CkU9lyBLH8ZgMShqW7xaXKvtcNWIu_0rDu7N_HLaCjfUjenmsyPgFIZf47vz2_SusWl_VxhwEreKuoT-Ff46ROqa8VgP4LCfbS9ooqI4hb6d1A/s1600/add-pages-in-blogger-copy.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Add-New-Pages-or-Tabs" border="0" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjri93lsHPtbiL35IfudbSqjWUhr9Na_CkU9lyBLH8ZgMShqW7xaXKvtcNWIu_0rDu7N_HLaCjfUjenmsyPgFIZf47vz2_SusWl_VxhwEreKuoT-Ff46ROqa8VgP4LCfbS9ooqI4hb6d1A/s1600/add-pages-in-blogger-copy.jpg" title="Add-New-Pages-or-Tabs" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Add-New-Pages-or-Tabs<br />
<br />
<span style="color: magenta; font-family: Trebuchet MS, sans-serif; font-size: large;">Like Us On Facebook To View More And Unlock</span></td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<br />
<br />
<article id="default-usage">
 <div class="to-lock" style="display: none;">
<div class="separator" style="clear: both; text-align: center;">
<span style="background-color: #fafafa; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px; text-align: start;">Blogger comes with a </span><strong style="background-color: #fafafa; border: 0px; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px; margin: 0px; padding: 0px; text-align: start;">Pages</strong><span style="background-color: #fafafa; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px; text-align: start;"> feature (also known as Tabs), but it is often overlooked. Pages and Posts differ in that Posts are timestamped and archived as articles. Pages are static pages that should be used for all of the content that is NOT an article and that you might use in a navigation menu. Pages do not appear on your home page like Posts do.  Today I am going to show you how to easily add new Pages to your Blogger blog and get them to appear in a top menu.</span></div>
<h4 style="background-color: #fafafa; border: 0px; color: #222222; font-family: Vidaloka; font-size: 14px; font-stretch: normal; font-weight: 400; line-height: 1.5em; margin: 12px 0px; padding: 0px;">
How to add new Blogger Pages/Tabs</h4>
<div style="background-color: #fafafa; border: 0px; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px; margin-bottom: 18px; margin-top: 8px; padding: 0px;">
1. Navigate to your Blogger dashboard and click on the <strong style="border: 0px; margin: 0px; padding: 0px;">Pages</strong> button below the Posts link.</div>
<div style="background-color: #fafafa; border: 0px; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px; margin-bottom: 18px; margin-top: 8px; padding: 0px;">
2. At the top, click <strong style="border: 0px; margin: 0px; padding: 0px;">New Page</strong>.</div>
<div style="background-color: #fafafa; border: 0px; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px; margin-bottom: 18px; margin-top: 8px; padding: 0px;">
3. The Blogger editor will open. It is the same as the one you use to create your posts. Enter the title of your page in the<strong style="border: 0px; margin: 0px; padding: 0px;">Page Title</strong> text box and your page content in the <strong style="border: 0px; margin: 0px; padding: 0px;">content</strong> area.</div>
<div style="background-color: #fafafa; border: 0px; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px; margin-bottom: 18px; margin-top: 8px; padding: 0px;">
4. Being a Page, you have the option here to choose whether or not you want to allow comments. In the sidebar of the editor, under <strong style="border: 0px; margin: 0px; padding: 0px;">Page Options</strong>, click it and a dropdown will appear. Under Reader Comments you can choose either <strong style="border: 0px; margin: 0px; padding: 0px;">Allow</strong> or <strong style="border: 0px; margin: 0px; padding: 0px;">Disallow</strong>. Disallow will hide the comment link and box completely.</div>
<div style="background-color: #fafafa; border: 0px; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px; margin-bottom: 18px; margin-top: 8px; padding: 0px;">
5. Publish the page.</div>
<h4 style="background-color: #fafafa; border: 0px; color: #222222; font-family: Vidaloka; font-size: 14px; font-stretch: normal; font-weight: 400; line-height: 1.5em; margin: 12px 0px; padding: 0px;">
<strong style="border: 0px; margin: 0px; padding: 0px;">Creating a menu bar with your Page links</strong></h4>
<div style="background-color: #fafafa; border: 0px; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px; margin-bottom: 18px; margin-top: 8px; padding: 0px;">
1. Go to the <strong style="border: 0px; margin: 0px; padding: 0px;">Layout</strong> page in the Blogger dashboard.</div>
<div style="background-color: #fafafa; border: 0px; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px; margin-bottom: 18px; margin-top: 8px; padding: 0px;">
2. Under the Header element in the gadget arrangement, click <strong style="border: 0px; margin: 0px; padding: 0px;">Add a Gadget</strong> as shown in the image above.</div>
<div style="background-color: #fafafa; border: 0px; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px; margin-bottom: 18px; margin-top: 8px; padding: 0px;">
3. Choose the <strong style="border: 0px; margin: 0px; padding: 0px;">Pages</strong> gadget and add it.</div>
<div style="background-color: #fafafa; border: 0px; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px; margin-bottom: 18px; margin-top: 8px; padding: 0px;">
4. It will give you a couple of options of what pages you would like to put in your menu. Place a checkmark next to the ones you want to appear. You can always edit this later.</div>
<div style="background-color: #fafafa; border: 0px; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px; margin-bottom: 18px; margin-top: 8px; padding: 0px;">
5.  (Optional) If you want to add external links to your menu, you can also do that in here. External links are those that you have a URL for, such as a Facebook URL or a link off of your blog. Click the +Add External Link option and a box will pop up asking for the Page Title (i.e. “Facebook” or whatever you want the title to be in your menu) as well as the URL. Click Save Link when done.</div>
<div style="background-color: #fafafa; border: 0px; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px; margin-bottom: 18px; margin-top: 8px; padding: 0px;">
6. <strong style="border: 0px; margin: 0px; padding: 0px;">Save</strong> your gadget!</div>
<div style="background-color: #fafafa; border: 0px; color: #141414; font-family: Roboto; font-size: 14.3000001907349px; line-height: 23.3999996185303px; margin-bottom: 18px; margin-top: 8px; padding: 0px;">
That’s all there is to it. Blogger allows each blog to have 20 additional pages. You should always link to Pages for static content as opposed to individual posts.</div>
<div>
<span style="color: magenta; font-size: x-large; font-weight: normal;"><br /></span></div>
</div>
</article>

Blogger How To: Add New Pages or Tabs

AyanKhan 0 Blogger Tricks, Blogger Tutorials, Blogging 11:40:00

Blogger How To: Add New Pages or Tabs Add-New-Pages-or-Tabs Like Us On Facebook To View More And Unlock Blogger comes with a Pages feature (also known as Tabs), but it is often overlooked. Pages and Posts differ in that Posts are timestamped and a… Read more »

12Jul2015

A.Softs Inc

Blogger How To: Center Your Header

Blogger How To: Add New Pages or Tabs

Popular Posts

Labels

Blog Archive