Chèn Banner hình ảnh cho blogger

(Thêm Banner hình ảnh cho blogger)

- Banner là một thành phần rất quan trọng đối với 1 Website, Blog, ứng dụng Web… Banner thể hiện được mục tiêu và hướng đi của trang Web và nó thu hút, lôi cuốn sự chú ý của người xem. Khi người xem truy cập vào 1 địa chỉ Web nào đó, 2 thành phần mà người xem thường quan tâm đầu tiên đó là Logo và Banner. 

Đối với các Website hay Blog, thường có 2 cách để đặt Banner, đó là sử dụng thuộc tính background-image:url trong CSS hoặc thiết lập trên giao diện Web của người quản trị.

Hôm nay, Kênh phần mềm sẽ giới thiệu với các bạn 2 cách để đưa Banner quảng cáo hoặc hình ảnh vào Header của blog.

1. SỬ DỤNG CSS
- B1: Đăng nhập vào blogger,
- B2: Chọn Trình bày > Mẫu > Chỉnh sửa HTML
- B3: Các bạn kiếm dòng dưới đây

Đoạn mã 1:

#header-wrapper {
width:940px;
margin:0 auto 10px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;}

- B4: Thêm đường dẫn ảnh Banner
Thêm dòng này

background-image:url('địa chỉ');

vào sau dòng

margin:0 auto 10px;

Như vậy đoạn mã 1 của bạn sẽ là:

#header-wrapper {
width:940px;
margin:0 auto 10px;
background-image:url('địa chỉ');
-moz-border-radius: 15px;
-webkit-border-radius: 15px;}

Trong đó địa chỉ bạn điền đường dẫn đầy đủ của banner. VD bạn có 1 banner tại địa chỉ: http://1.bp.blogspot.com/-oHe-C9BE524/UorCTf6r-HI/AAAAAAAAAww/JdaQxtxRFuM/s1600/Banner_CustomSoftware.png thì đoạn mã sẽ là:

#header-wrapper {
width:940px;
margin:0 auto 10px;
background-image:url('http://1.bp.blogspot.com/-oHe-C9BE524/UorCTf6r-HI/AAAAAAAAAww/JdaQxtxRFuM/s1600/Banner_CustomSoftware.png');
-moz-border-radius: 15px;
-webkit-border-radius: 15px;}

- B5: Lưu lại các thay đổi.

2. SỬ DỤNG GIAO DIỆN QUẢN TRỊ ADMIN

- B1: Đăng nhập vào Blogger

- B2: Kích chọn Menu Bố cục (Layout), kích nút Edit tại mục Header

- B3: Hộp thoại xuất hiện

- Lựa chọn hình ảnh từ máy tính hoặc từ 1 địa chỉ Internet

- Lựa chọn Thay cho tiêu đề và mô tả (Instead of title and description) tại mục Vị trí 

- B4: Kích nút Lưu

Ấn F5 để tải lại Blog, bạn sẽ nhìn thấy Banner đã được chèn vào Blog.

Kênh phần mềm việt

About "Administrator"

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus suscipit, augue quis mattis gravida, est dolor elementum felis, sed vehicula metus quam a mi. Praesent dolor felis, consectetur nec convallis vitae.