Hiển thị các bài đăng có nhãn THỦ THUẬT. Hiển thị tất cả bài đăng
Hiển thị các bài đăng có nhãn THỦ THUẬT. Hiển thị tất cả bài đăng

Hướng dẫn tạo bài viết nổi bật cho blogspot

Chào anh em đã quay lại blog mình nhé hôm nay mình sẽ hướng dẫn anh em tạo widget bài viết nổi bật cho blogspot

HƯỚNG DẪN THỰC HIỆN

Bước 1: Các bạn đăng nhập vào trang quản trị blogger chọn Chủ đề => Chỉnh sửa rồi các bạn dán đoạn code sau lên trước thẻ ]]></b:skin>

figure.snip1205 {
 position: relative;
 float: left;
 overflow: hidden;
 margin: 10px 1%;
 min-width: 220px;
 max-width: 310px;
 width: 100%;
 background: #000000;
 text-align: center;
 box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
figure.snip1205 * {
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 -webkit-transition: all 0.35s ease-in-out;
 transition: all 0.35s ease-in-out;
}
figure.snip1205 img {
 max-width: 100%;
 vertical-align: top;
height: 220px;
}
figure.snip1205 i {
 position: absolute;
 top: 50%;
 left: 50%;
 border-radius: 50%;
 font-size: 40px;
 color: #000000;
 width: 60px;
 height: 60px;
 line-height: 60px;
 background: #ffffff;
 box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
 -webkit-transform: translate(-50%, -50%) scale(0);
 transform: translate(-50%, -50%) scale(0);
 transition: all 300ms 0ms cubic-bezier(0.6, -0.28, 0.735, 0.045);
}
figure.snip1205 a {
 left: 0;
 right: 0;
 top: 0;
 bottom: 0;
 position: absolute;
}
figure.snip1205.blue {
 background-color: #2472a4;
}
figure.snip1205.blue i {
 color: #20638f;
}
figure.snip1205.red {
 background-color: #ab3326;
}
figure.snip1205.red i {
 color: #962d22;
}
figure.snip1205.yellow {
 background-color: #e08e0b;
}
figure.snip1205.yellow i {
 color: #c87f0a;
}
figure.snip1205.green {
 background-color: #229955;
}
figure.snip1205.green i {
 color: #1e8449;
}
figure.snip1205.orange {
 background-color: #d67118;
}
figure.snip1205.orange i {
 color: #bf6516;
}
figure.snip1205.navy {
 background-color: #2b3c4e;
}
figure.snip1205.navy i {
 color: #222f3d;
}
figure.snip1205:hover img,
figure.snip1205.hover img {
 opacity: 0.3;
 -webkit-filter: grayscale(100%);
 filter: grayscale(100%);
}
figure.snip1205:hover i,
figure.snip1205.hover i {
 -webkit-transform: translate(-50%, -50%) scale(1);
 transform: translate(-50%, -50%) scale(1);
 transition: all 300ms 100ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

Bước 2: Các bạn tìm đến thẻ đóng </body> rồi dán đoạn code sau lên trước nó

<script type='text/javascript'>
//<![CDATA[
 $(".hover").mouseleave(
 function () {
 $(this).removeClass("hover");
 }
 );
//]]>
</script> 

Bước 3: Sau đó các bạn lưu mẫu lại rồi vào Bố cục => Thêm tiện ích rồi dán đoạn code sau vào đó

<figure class="snip1205">
 <img src="http://i.imgur.com/dvS447x.jpg" alt="sample2"/>
 <i class="fa fa-picture-o"></i>
 <a href="#"></a>
 </figure>
 <figure class="snip1205 blue">
 <img src="http://i.imgur.com/ihFFID9.jpg" alt="sample4"/>
 <i class="fa fa-check-circle"></i>
 <a href="#"></a>
 </figure>
 <figure class="snip1205 green">
 <img src="http://i.imgur.com/ARdzTaN.jpg" alt="sample3"/>
 <i class="fa fa-star"></i>
 <a href="#"></a>
 </figure> 

Thay đổi hình ảnh và URL bài viết mà bạn muốn hiển thị vào rồi nhấn lưu lại

Hướng dẫn đăng kí Google Adsense cho blogspot của bạn đơn giản nhất

Như các bạn đã biết nguồn thu chính của Google là quảng cáo. Và Google AdSensei, Bài viết này mình chỉ đề cập đến những người có website mà chưa biết cách đặt quảng cáo trên trang web của họ. Hiện nay Google AdSense rất được cồng đồng blogger Việt ưa chuộng, nếu chịu khó quan sát bạn sẽ thấy có rất nhiều các trang web lớn tại Việt Nam đang đặt quảng cáo của Google AdSense.

Chúng ta cùng bước vào quá trình đăng kí Google Adsense nhé

Bước 1 Chúng ta thiết lập ngôn ngữ nhé
lưu ý những blogspot nào tiếng anh thì  không cần thực hiện bước này nhé

Để thực hiện bước đăng kí chúng ta cần đăng nhập vào blog => Chọn Cài Đặt => tiếp tục chọn Ngôn ngữ và định dạng
Tại phần ngôn ngữ bạn đổi từ Tiếng Viết sang Tiếng Anh ( Hoa Kì ) - English (Uniter Stastes)
Tiếp theo ấn F5 tải lại trang để xuất hiện mục DOANH THU nhé
Bấm chọn vào thẻ  Doanh Thu AdSense (Earnnings AdSense) => Tiếp tục bấm vào nút Đăng ký AdSense (Sign up for Adsense).  

Khi đó bạn sẽ được chuyển hướng đến trang đăng ký của Google AdSense. Ở đây có 2 lựa chọn cho bạn là Tạo một tài khoản Google mới cho tài khoản AdSense  của bạn. Tuy nhiên theo ý kiến cá nhân của mình là hãy sử dụng chính tài khoản Gmail hiện tại của bạn bằng cách bầm vào nút Có, Tiến hành đăng nhập tài khoản Google (Yes, proceed to Google Account sign in) để đăng nhập vào trang đăng ký (Lưu ý đây là tài khoản gmail đừng hiểu nhầm là tài khoản AdSense nhé, Tài khoản AdSense là tài khoản bạn có được sau khi google chấp thuận đơn đăng ký Google AdSense  của bạn).
Ảnh minh họa ( Nguồn TEROCKET )

Một khi bạn đăn ký AdSense qua Blogger thì mặc định Google sẽ hiểu là bạn đăng ký AdSense  cho blog đó. Do vậy bạn không thể chỉnh sửa được URL của trang bạn muốn đăng ký quảng cáo. Bạn chỉ có thể chọn được Ngôn ngữ nội dung (Content Language). Đây chính là nội dung của blog bạn (đồng thời cũng là nội quảng cáo sẽ hiển thị, nên chọn Tiếng việt  nếu độc giả của bạn hướng đến là người Việt Nam).

Làm như hình nhé

Ảnh minh họa ( Nguồn TEROCKET )

Rồi bạn cứ làm theo bên Google là xong nhé
Đợi Google trả mail về để biết bạn đăng kí thành công hay thất bại 






Hướng dẫn tạo khung quảng cáo cho blogger

Hôm nay mình sẽ hướng dẫn cho ae cách tạo Phần Quảng Cáo cho blogger nhé

B1 : Ae up tấm ảnh quảng cáo lên như mình nhé

Đặt liên kết cho tấm ảnh tức là khi người dùng click vào tấm ảnh sẽ chuyển sang link web cần quảng cáo chẳng hạn
Sau khi đã đặt liên kết
Các bạn chuyển sang Html
B2 Copy toàn bộ

B3 : Vào Bố Cục . thêm tiện ích Html/Javascript
dán toàn bộ đoạn code trên vào phần nôi dung 
Lưu lại và xem thành quả thôi






Cách tạo khung liên kết website cho blog của bạn cực đẹp

He lô !! ae và hôm nay mình vừa tìm hiểu được cách tạo khung liên kết web cho blog cá nhân và còn chờ gì nữa bắt đầu hướng dẫn ae thôi !!
   Sau đây là ảnh demo

B1 : Ae đăng nhập vào blogger Vào Bố Cục + thêm tiện ích html/javaScrip

B2 : copy đoạn code sau dán vào phần nội dung

<div class="widget-content">
<style>
#lkbb-widget::-webkit-scrollbar{width:5px}
#lkbb-widget::-webkit-scrollbar-thumb{background:#000000;border-radius:100px}
#lkbb-widget::-webkit-scrollbar-thumb:active{background:#000000}
#lkbb-widget{padding:0;margin:0;list-style:none;max-height:310px;overflow:auto}
.lkbb-widget{margin:0;padding:0}
.lkbb-widget li{margin:0;padding:0;line-height:normal;display:block;float:left;text-align:center;width:50%}
.lkbb-widget a{text-overflow: ellipsis; overflow: hidden; white-space: nowrap; display: block; margin: 0 5px 5px 0; padding: 7px 15px; font: 400 17px Roboto!important; -webkit-transition: .3s; letter-spacing: -.35px; border-radius: 0; -moz-transition: .3s; -o-transition: .3s; color: #000000!important; border: 1px solid #000000;border-radius: 40px}
.lkbb-widget a:hover{color:#006d68!important;border:1px solid;border-radius: 12px;}
</style>
<div id="lkbb-widget">
<div class="lkbb-widget">
<li><a href='http://anhstarit.blogspot.com///' target='_blank' title='Anh Star IT'>Anh Star IT</a></li>
<li><a href='http://anhstarit.blogspot.com///' target='_blank' title='Anh Star IT'>Anh Star IT</a></li>
<li><a href='http://anhstarit.blogspot.com///' target='_blank' title='Anh Star IT'>Anh Star IT</a></li>
<li><a href='http://anhstarit.blogspot.com///' target='_blank' title='Anh Star IT'>Anh Star IT</a></li>
<li><a href='http://anhstarit.blogspot.com///' target='_blank' title='Anh Star IT'>Anh Star IT</a></li>
<li><a href='http://anhstarit.blogspot.com///' target='_blank' title='Anh Star IT'>Anh Star IT</a></li>
<li><a href='http://anhstarit.blogspot.com///' target='_blank' title='Anh Star IT'>Anh Star IT</a></li>
<li><a href='http://anhstarit.blogspot.com///' target='_blank' title='Anh Star IT'>Anh Star IT</a></li>
</div></div></div>

B3 : chỉnh sửa
thay đoạn http://anhstarit.blogspot.com/ thành link web muốn liên kết
thay đoạn Anh Star IT thành Tên demo của web muốn liên kết
Nếu bạn muốn thay màu nền khác thì kéo lên đầu đoạn code nhé

Lưu lại và xem thành quả thôi

Xem thêm 

Hướng dẫn Edit PSD Poster Chạy Ngay Đi

Đầu tiên Ae tải PSD về Link PSD

Tiếp theo  làm như hình

Bạn xóa phần Ảnh Cần Đổi + Gradient Map và thêm ảnh của mình vào

Để làm hiệu ứng như poster thì bạn vào Gradient Map

Vậy là xong chúc các bạn thành công nhé





Bài viết mới