Thay logo (favicon)cho blog, web bằng logo riêng (thay thế icon blog trên thanh address )

Chèn đoạn Code dưới đây vào sau thẻ <head>:

<link href=' http://www.dvt.com.vn/favicon.ico ' rel='shortcut icon' type='image/x-icon'/>

Thay link   http://www.dvt.com.vn/favicon.ico bằng link logo của bạn.

Sau khi tạo ra file ảnh logo (favicon.png hoặc favicon.jpg ....) kích cỡ 32x32 hoặc 48x48 bạn vào đây để tạo file favicon.ico

Để có link file ico, bạn có thể làm theo hướng dẫn tạo host và lấy link tại đây

Và đây là sản phẩm:

Từ khóa : ảnh, file,

Amazing Beveled Buttons Using CSS3

Creating buttons with CSS3 is really a nice way to create buttons with different styles. But its bit uncomfortable to create extra ordinary buttons with CSS only. And more that you can easily create buttons with bevel in photoshop but its hard to create button with css only, so i just wanted to share buttons i created with css only and almost its having bevel in it.
Have a Look

Buttons

Live Demo [Working Buttons !!] 

How it's Made ?

This awesome buttons made by CSS3 and some nice effort. We have made this buttons for make it use for "Live Demo" buttons or "Download" Buttons etc...

These buttons can also use in quick action buttons like 50% off or any other offer you provide. anyway let's have a look at its CSS3 and HTML5,

To add it to blogger,

you'll need to add CSS to your template,

for that just follow the steps,

# Open the Blogger Dashboard

# Navigate to Template click on edit template,

# Find "]]></b:skin" and add following css code just above that line,

CSS CODE

.button
{
  cursor:pointer;
  text-align:center;
  padding:20px;
  border:2px solid rgba(255,255,255,.8);
  background:grey;
  width:250px;
  border-radius:150px;
  color:white;
  font:normal 40px 'sans-serif';
  box-shadow:0 5px 3px #000;
  -moz-box-shadow:0 5px 3px #000;
  -webkit-box-shadow:0 5px 3px #000;
  -ms-box-shadow:0 5px 3px #000;
  -o-box-shadow:0 5px 3px #000;
  transition:300ms ease-in-out;
  -ms-transition:300ms ease-in-out;
  -moz-transition:300ms ease-in-out;
  -webkit-transition:300ms ease-in-out;
  -o-transition:300ms ease-in-out;
}
.button:hover
{
  box-shadow:0 10px 4px #000;
  -moz-box-shadow:0 10px 4px #000;
  -o-box-shadow:0 10px 4px #000;
  -ms-box-shadow:0 10px 4px #000;
  -webkit-box-shadow:0 10px 4px #000;
  transform:translateY(-5px);
  -ms-transform:translateY(-5px);
  -o-transform:translateY(-5px);
  -webkit-transform:translateY(-5px);
  -moz-transform:translateY(-5px);
}
.button:active
{
  box-shadow:0 0 2px #000,inset 0 10px 5px #000;
  -ms-box-shadow:0 0 2px #000,inset 0 10px 5px #000;
  -o-box-shadow:0 0 2px #000,inset 0 10px 5px #000;
  -moz-box-shadow:0 0 2px #000,inset 0 10px 5px #000;
  -webkit-box-shadow:0 0 2px #000,inset 0 10px 5px #000;
  transform:translateY(10px);
  -ms-transform:translateY(10px);
  -o-transform:translateY(10px);
  -webkit-transform:translateY(10px);
  -moz-transform:translateY(10px);
}

After adding this code just save the template, now go ahead adding buttons and customizing its style,
now we will add buttons to the website or blog,
Now select the place where you want to render those buttons just like inside widget or inside post or any page,
And copy this html code with your need to be show this awesome CSS3 buttons,

HTML CODE

<div class="button">Live Demo</div>

# Now you're done adding button to your desired place.
We'll right back with its different styles as shown in photo ...
Here is just rounded shaped button.
If any query then send us a mail or comment here ...

Hướng Dẫn Tạo Favicon Cho Web/Blogs

Hẳn là bạn đã từng thấy rất nhiều biểu tượng hoặc logo của các công ty lớn thường được đặt ngay tại vị trí góc bên trái của trình duyệt như hình sau :

Hôm nay mình sẽ hướng dẫn các bạn cách tạo ra các favicon cho riêng mình.

Bước 1 : Chọn cho mình 1 file hình mà bạn muốn tạo làm favicon, có thế lấy từ biểu tượng logo hoặc 1 biểu tượng gì đó liên quan đến blog hay web cửa bạn. Kế tiếp là chỉnh sửa tấm hình cho nó vuông vức, theo mình thì nên để kích thước là 100×100 pixel.

Bước 2 : Bạn truy cập vào địa chỉ sau : http://www.favicongenerator.com/

Bước 3 : Sau khi vào các bạn sẽ nhấn nút Browse để chọn file hình mà các bạn đã làm sẵn ở bước 1, và khi đã chọn xong các bạn nhấp nút Generator Favicon ! là xong,

Bước 4: đây là bước đơn giản nhất, các bạn chỉ cần việc nhấp chuột phải vào tấm hình hoặc download file hình về là xong, nhớ chú ý file favicon có đuôi ở phần mở rộng là .ico

Vậy là công việc của mình đến đây đã hoàn thành, chúc các bạn thực hiện thành công .

Cách Đổi Favicon Trên Blogspot

Đối với nhiều blogger, việc có một biểu tượng favicon riêng cho blog thể hiện tính chuyên nghiệp và là biểu tượng nhận diện riêng cho blog của mình, hoặc nếu bạn đã quá nhàm chán với biểu tượng favicon mặc định của blogspot, thì bài viết sau sẽ giúp bạn làm được điều đó mà không phải chỉnh bất cứ một đoạn html hay code nào cả.

1.Đăng nhập vào Blog

2.Tùy chọn (Mũi tên xuống)

3.Chọn bố cục

4. Sau đó các bạn chọn Chỉnh sửa ( Edit ) như hình bên dưới

1 cửa sổ mới sẽ xuất hiện và tại cửa sổ này bạn sẽ lựa chọn favicon của riêng mình từ máy tính của bạn để thay thế favicon mặc định trong blogspot.

Lưu ý : Các bạn chỉ có thể upload lên file hình có đuôi mở rộng là .ico , các bạn có thể tạo ra bằng bất cứ phần mềm nào bạn muốn, còn nếu không thì các bạn có thể xem hướng dẫn tạo file hình favicon cho web tại các bài viết trước của mình

Sau khi chọn xong các bạn chỉ việc nhấp lưu là xong, vậy là từ nay các bạn đã có một biểu tượng riêng cho blog của mình xuất hiện trên trình duyệt.

Chúc các bạn thành công !