Showing posts with label Tutorial. Show all posts
Showing posts with label Tutorial. Show all posts

Tuesday, August 19, 2008

Example:

The header is the first element that most visitor see on you blog. Yes, it's the most important thing. The header makes your blog be different for another. That's why you have to get more attentioan on your blog header.
Read More...

There 3 steps to create that 'Read More' link.

Step 1, update your template:


1. You must login on Blogger.
2. Click on Layout.
3. After that, click on Edit HTML.
4. Find 'Expand Widget Template' checkbox, then check it.
5. Find this code on HTML code:

<p><data:post.body/></p>

6. Delete that code, change with this one:

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/></p>
<a expr:href='data:post.url'>Read More......</a>
</b:if>

7. Save our works.

Step 2, create your template post:


1. Click on Setting > Formatting.
2. Find 'Post Template' form, fill the form with this code:

<span class="fullpost">
</span>

3. Save.

Step 3, create your new post:


1. Create new post.
2. Between 2 tabs, 'Compose' and 'Edit HTML', choose Edit HTML. You can see code of post template.
3. Put your main article before '<span class="fullpost">' and rest your article after that. Close the article with this code '</span>'

Now, the example code:
The header is the first element that most visitor see on you blog. Yes, it's the most important thing. The header makes your blog be different for another. That's why you have to get more attentioan on your blog header.
<span class="fullpost">Even you using a free public template. If you choose using a free public template, you still have to modify your current header. Give some touch to look different form the original. That's makes your blog can be different.</span>

-- D O N E --

Thursday, August 14, 2008

Blogger release new interface, named Google Gadgets.

What it is?
More like widget. The diffrent is Google Gadget allows for the integration of iGoogle Gadgets directly into your sidebar. Also built into Gadgets is blogger Gadget Directory, which lets you browse through thousands of cool gadgets and add them to your blog with a simple click of a button.

Gadgets have built-in configuration for easy integration into your layout. All gadgets are automatically sized to match the width of your sidebar, and their height in pixels can be adjusted using the Gadget's built-in options.

Cool, isn't it?

How to use it?
Simple. The different is, blogger change the link with 'Add a Gedget' at layout page. After click that link, a new window will come out. Now you see thousand gadgets, ready to use. List by the category.

The gadget you pick, click the '+' button.


If you try to searching some gadget. You can use the searching form.

-- Itching to get started? --

Friday, August 8, 2008

In web development, Cascading Style Sheets (CSS) is a stylesheet language used to describe the presentation of a document written in a markup language. Its most common application is to style web pages written in HTML and XHTML, but the language can be applied to any kind of XML document, including SVG and XUL.

CSS is used by both the authors and readers of web pages to define colors, fonts, layout, and other aspects of document presentation. It is designed primarily to enable the separation of document content (written in HTML or a similar markup language) from document presentation (written in CSS). This separation can improve content accessibility, provide more flexibility and control in the specification of presentational characteristics, and reduce complexity and repetition in the structural content. CSS can also allow the same markup page to be presented in different styles for different rendering methods, such as on-screen, in print, by voice (when read out by a speech-based browser or screen reader) and on Braille-based, tactile devices. CSS specifies a priority scheme to determine which style rules apply if more than one rule matches against a particular element. In this so-called cascade, priorities or weights are calculated and assigned to rules, so that the results are predictable.

The CSS specifications are maintained by the World Wide Web Consortium (W3C). Internet media type (MIME type) text/css is registered for use with CSS by RFC 2318 (March 1998).

Saturday, July 26, 2008

Blog Elements When creating a blog template I found there are few elements

I always used. One blog always have 5 elements:

  1. Header
  2. Content Area
  3. Sidebar
  4. Comment
  5. Footer

I will describe all, one by one.


1. Header



The header is the first element that most visitor see on you blog. Yes, it's the most important thing. The header makes your blog be different for another. That's why you have to get more attentioan on your blog header. Even you using a free public template. If you choose using a free public template, you still have to modify your current header. Give some touch to look different form the original. That's makes your blog can be different. Pelase remember that is important thing if you can make your blog header memorable and eye catching.

Tips:

  • Put your blog title with a bigger font.
  • Put your tagline, message with a normal font or a little bigger than normal
    font.
  • Be more creative, example using a nice image with a nice color.

2. Content Area


This the element where you put your article.It's means, this element is the visitor most spend their time on your blog. They will be read all of your article if they feel comfortable on your blog.

Tips:

  • Build a hierarchy that establishes a flow. Title and content must be in
    a different style. You can using a different color, size, weight, background
    color, etc. A title must have a link!
  • Keep your content clean and consistent, more easier to read your article.
  • When your styling links, make sure that they pop out enough to call attention
    to it, but not so much that it is distracting when reading.

3. Sidebar

This elements is the section where you can put article archieve, blogroll, links, advertising, everything that you wanna put on it. Some weblog service has widget to manage this elements. More easier using widget.

Tips:
  • Do not use any unnecessary widget that doesn't really help the reader find what they are looking for.
  • Organized sidebar with title.
  • Keep your sidebar clear space.

4. Comment



Comment are where you can get feedback from visitor, communication with the visitor.

Tips:
  • Design your comment element different from other element, especially content are.
  • Make it easy for a reader to see that each comment is separate from each other.
  • Design the author comment with different but still looks like part of comment. Example, using a different color.
  • Design miscellaneous information like name, date, and number different from the content comment.

5. Footer


Some peoples don't want to use this elements. They just just stick a copyright on the bottom with some basic links. But, you can more creative on this element. For example, this blog:


By adding some links and some widget, you can control your sidebar, not overflowing.

Tips:
  • Design the footer so that is contrasts with your regular content.
  • Keep it simple, so visitor can read.

 
Rini's Design Blog Diseñado por Wpdesigner y adaptado por Zona Cerebral