Arsip Kategori: Data Formats

Marquee Codes Images and Text


Images and Text

Flying bat in a marquee
Bruce the Bat

There’s nothing to stop you putting more than one HTML element inside your HTML marquee codes. Doing so will make both scroll.

Source Code Result

Flying bat in a marquee
Bruce the Bat

Flying bat in a marquee
Bruce the Bat

Automatic Recent Posts Slider With jQuery For Blogger






//<![CDATA[
$(document).ready(function(){
$("#slider").easySlider({
auto: true,
continuous: true
});
});
//]]>


Now save your template.

Step 3 -Adding The Gadget

  • Now go to Page Layout
  • Add a Gadget > HTML/JavaScript
  • Paste below piece of code and save it.




var numposts_gal = 6;
var numchars_gal = 150;
var random_posts = false; // random posts




  • Now replace yourblog.blogspot.com with your own blog url.[Code Line – 10] (Only change blog URL don’t change any other things.
  • To change number of post find this var numposts_gal = 6; line in above code. (Code Line – 4)
  • If you want to change number of characters to show in description find this piece of code var numchars_gal = 150; (Code Line – 5)
Now save your all the changes and you are done.Visit your blog to see this beautiful slide.

Follow this tutorial to show this gadget only on specific page or only in homepage.

Your questions,queries and feedback are always welcome.Also if you need any help about customizing this gadget then feel free to ask me.I’ll glad to help you.
Good day….

By: http://www.helperblogger.com/

What can I do with CSS?


You can change almost any aspect of your blog’s appearance just by changing the style sheet in your template. Some of the most common things to do are listed here. For more in-depth tutorials and examples, please see W3 Schools CSS Examples and The W3C Introduction to CSS.
Our default templates have all the CSS information towards the top, between <style></style> tags. You’ll see a bunch of lines there that look like this:
The highlighted line shows the style that is applied to every <h3> tag in your blog. What we’re going to describe here are some options for how to style it. Any of the pieces of code below can be inserted between the { curly brackets } in the style sheet.

Code Examples
Colors
color:blue; This text is blue.
background:yellow; This has a yellow background.
You can insert the names of many common colors here (e.g. red, green, yellow) or you can use hexadecimal codes for a greater range of colors (e.g. #0033AA). For more information on color, please see the Web Color Reference.
colspan=”2″>Borders
border:solid 1px red;
This has a red border.
A border can be solid, dotted or dashed. The width here is specified in pixels (px). Colors can be names or hexadecimal codes. To only do a border on one side, use border-top, border-bottom, border-right, or border-left.
Fonts
font-family:"Times New Roman",Serif; This is in a serif font.
font-family:Verdana,Sans-Serif; This is in a sans-serif font.
You can specify a list of font choices. If the first one isn’t available on your reader’s computer, the next will be used, and so on. Indicating “Serif” will use any available serif font.
font-size:24px; This text is 24 pixels high.
The units of size can be pixels (px), points (pt), inches (in) or percent of the default size (%).
font-weight:bold; This text is bold.
Choices are bold and normal.
text-decoration:underline; This text is underlined.
The text decoration can be set to none, underline, overline, or line-through. This is most commonly used to remove the underlining on links.
text-align:right;
This text is right aligned.
The alignment can be set to left, right, or justify.
Margins and Padding
margin:15px;
This has a 15px margin all around.
padding:15px;
This has 15px of padding all around.
Margin and padding both specify the amount of space around something. The difference is that a margin is outside the border and padding is inside. (The border here is just for illustration.)

As with the border, you can specify one side at time with margin-left, padding-top, etc. You can also set all at once with margin:1px 2px 3px 4px; where the order is top, right, bottom, left.

Notes:
You can also use inline styles, if you want to do one-time formatting for a specific piece of text in a post. Here is the format to use:
<span style="color:red;">This text will be red.</span>

updated 03/08/2013

Edit CSS in the Template Designer


Blogger’s Template Designer allows you to customize almost any aspect of your blog’s appearance through the use of cascading style sheets (CSS). To add custom CSS snippets to your template, go to the Template tab and click Customize. Then, add your code to the field located in the Advanced | Add CSS tab. Changes you make will reflect instantly in a live preview beneath the editor.
Note: Editing CSS allows you to change the look and feel of your blog. For changes to the actual content of your blog, including the adding of gadgets or changes to the layout, click Edit HTML on the Template tab. Also remember that, like other customizations, your CSS will be removed if you change designs.
For a comprehensive list of various CSS tweaks, please see the What can I do with CSS article in our Help Center.
updated 02/15/2013