Bài thơ Ngẩn ngơ

 

 

Ngẩn ngơ

 

Em đi dấu cát vu vơ

Đong đưa mây tóc ngủ hờ trên vai

Nghiêng nghiêng chiếc bóng đổ dài

Cho ngôi trường nhỏ tháng ngày ngẩn ngơ.

 

Tác giả: Bé Ba - Lê Quang Trinh

Ảnh minh họa

Share:

Đọc thêm

Bài thơ Trăng lòng người yêu

 

Thơ

Tựa bài tạm đặt:

Trăng lòng người yêu

 

Trăng sáng quá - Ô - Trăng lòng lạnh quá

Gió đưa hương - lay động gió mơn man

Hoa đẹp quá và hương hoa thơm quá

Lá mềm lòng, rung rẩy uống - sương tan

 

Còn em? - E ấp, hiền ngoan

Yêu kiều, tha thướt, dịu dàng hơn hoa.

 

Tác giả: Bé Ba - Lê Quang Trinh

Ảnh minh họa Trăng - Thơ

Tạm nghĩ về tâm trạng tác giả: Tác giả mượn hình ảnh ánh trăng để nói lên nỗi lòng yêu mến người yêu. Quả thật khi đang yêu khômg dám ngỏ lời tình yêu làm thao thức nỗi lòng!

Share:

Đọc thêm

CÁCH TẠO NHÃN BÀI ĐĂNG GẦN ĐÂY HAY BÀI ĐĂNG MỚI NHẤT (LABEL)

 

TẠO NHÃN (LABEL) BÀI ĐĂNG GẦN ĐÂY

HAY BÀI ĐĂNG MỚI NHẤT

Bài viết trước mình vừa giới thiệu: Hiển thị bài đăng theo Nhãn hay label, khi thực hiện theo hướng dẫn tạo tiện ích bài đăng gần nhất bạn phải đọc và thực hiện theo bài trước. 

Tạo Nhãn (Label) Bài đăng gần đây hay Bài đăng mới nhất thật sự rất khó đối vớ Blogger do mẫu của Bloger không có. Nhưng với bài viết mà Blog Vn Chia sẻ thực hiện sẽ giúp cho thiết kế bài đăng gần đây thật dể.

Sau khi thực hiện các bước trên như bài viết trước: HIỂN THỊ BÀI VIẾT THEO LABEL TRONG BLOGSPOT – CODE. Tại bước 3, chỉ cần thêm code vào HTML / Javascript past đoạn code bên dưới vào và lưu lại như tạo các nhãn khác

 

<! -- Bài đăng theo nhãn -->

<script type='text/javascript'>var numposts = 20;var showpostthumbnails = true;var displaymore = false;var displayseparator = false;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 100;</script>

<script type="text/javascript" src="/feeds/posts/default/-/LABEL?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>

 

=> Ở đây có chút thay đổi ở đoạn Cript cần xóa: /-/LABEL

Và sẽ có dạng như bên dưới:

 

<! -- Bài đăng gần đây -->

<script type='text/javascript'>var numposts = 20;var showpostthumbnails = true;var displaymore = false;var displayseparator = false;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 100;</script>

<script type="text/javascript" src="/feeds/posts/default?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>

 

 

Ảnh sau khi thêm tiện ích bài đăng gần nhất hay mới nhất

Tạm kết: với bài viết mà Blog chia sẽ, hy vọng sẽ giúp Blogger thực hiện thiết kế blog theo mình thật ưng ý.

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

 * Đọc thêm:

- Hiển thị bài đăng theo Nhãn hay label. - Điều dưỡng nội tập 1 - Điều dưỡng nội tập 2. - Phác đồ điều trị bệnh tim mạch năm 2018

Share:

Đọc thêm

CÁCH HIỂN THỊ BÀI VIẾT THEO LABEL - CODE - SCRIPT TRONG BLOGSPOT

 

HIỂN THỊ BÀI VIẾT THEO LABEL TRONG BLOGSPOT 

(CODE  - SCRIPT)

 

Để thực hiện thành công Blog hiển thị bài viết theo nhãn hay Label. Blog Vn Chia sẻ phải tìm rất nhiều bài viết, đọc bài viết, thực hành, xem lại trang Blog theo yêu cầu chưa. Đúng là rất khó khăn cho người viết blog mà tự thiết kế Blog cho bản thân mình. Rất may là sau khi thử rất nhiều bài viết hướng dẫn trên các trang, mình tìm được bài hướng dẫn khá đơn giản và thành công. Chúng ta bắt đầu thực hiện theo mình chắc chắn sẽ thành công. 

Khi bắt đầu viết Blog thì chắc hẳn bạn đã từng tìm hiểu về code trên blog bài này mình sẽ không giới thiệu chi tiết. Mục tiêu là xoáy sâu vào tạo nhãn bài viết.

 

Hướng dẫn tạo các Nhãn bài viết (Widget) hiển thị bài viết mới Nhãn (Label).

 

- Đăng nhập Blogger -> vào Mẫu -> Chỉnh sửa HTML

- Sao lưu lại code trước khi thực hiện.

 

Bước 1: chèn Code trước thẻ ]]></b:skin>. 

Thực hiện: Nhấn Ctrl + F: Tìm->]]></b:skin> chèn Code trước thẻ này (]]></b:skin>). 

 

<!-- Star Bài viết theo Label - Code 1 -->

img.label_thumb{
float:left;
padding:5px;
border:1px solid #8f8f8f;
background:#D2D0D0;
margin-right:10px;
height:55px;
width:55px;
}
img.label_thumb:hover{
background:#f7f6f6;
}
.label_with_thumbs {
float: left;
width: 100%;
min-height: 70px;
margin: 0px 10px 2px 0px;
adding: 0;
}
ul.label_with_thumbs li {
padding:8px 0;
min-height:65px;
margin-bottom:10px;
}
.label_with_thumbs a {}
.label_with_thumbs strong {}

<!-- End Bài viết theo Label - Code 1 -->

 

 

Bước 2:  chèn code trước </head>

Thực hiện: Nhấn Ctrl + F: Tìm </head> chèn Code trước thẻ này (</head>)

 

<!-- Star Bài viết theo Label - Code 2 -->

 

<script type='text/javascript'>
//<![CDATA[
function labelthumbs(json){document.write('<ul class="label_with_thumbs">');for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){var commenttext=entry.link[k].title;var commenturl=entry.link[k].href;}
if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break;}}var thumburl;try{thumburl=entry.media$thumbnail.url;}catch(error)
{s=entry.content.$t;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){thumburl=d;}else thumburl='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZUiqRRBm0CxD0QPgdhw26GaapM1TGqEEioZawmkbRxwAkk1vwxitktG6bPCjhptLSlrVAY3q9xAw6wzNfrEkPxP71HSfXUL1mSX37habpss3OG3QlJlgRs90KtFHvXafwlHl8wkLBEvVN/';}
var postdate=entry.published.$t;var cdyear=postdate.substring(0,4);var cdmonth=postdate.substring(5,7);var cdday=postdate.substring(8,10);var monthnames=new Array();monthnames[1]="Jan";monthnames[2]="Feb";monthnames[3]="Mar";monthnames[4]="Apr";monthnames[5]="May";monthnames[6]="Jun";monthnames[7]="Jul";monthnames[8]="Aug";monthnames[9]="Sep";monthnames[10]="Oct";monthnames[11]="Nov";monthnames[12]="Dec";document.write('<li class="clearfix">');if(showpostthumbnails==true)
document.write('<a href="'+posturl+'" target ="_top"><img class="label_thumb" src="'+thumburl+'"/></a>');document.write('<strong><a href="'+posturl+'" target ="_top">'+posttitle+'</a></strong><br>');if("content"in entry){var postcontent=entry.content.$t;}
else
if("summary"in entry){var postcontent=entry.summary.$t;}
else var postcontent="";var re=/<\S[^>]*>/g;postcontent=postcontent.replace(re,"");if(showpostsummary==true){if(postcontent.length<numchars){document.write('');document.write(postcontent);document.write('');}
else{document.write('');postcontent=postcontent.substring(0,numchars);var quoteEnd=postcontent.lastIndexOf(" ");postcontent=postcontent.substring(0,quoteEnd);document.write(postcontent+'...');document.write('');}}
var towrite='';var flag=0;document.write('<br>');if(showpostdate==true){towrite=towrite+monthnames[parseInt(cdmonth,10)]+'-'+cdday+' - '+cdyear;flag=1;}
if(showcommentnum==true)
{if(flag==1){towrite=towrite+' | ';}
if(commenttext=='1 Comments')commenttext='1 Comment';if(commenttext=='0 Comments')commenttext='No Comments';commenttext='<a href="'+commenturl+'" target ="_top">'+commenttext+'</a>';towrite=towrite+commenttext;flag=1;;}
if(displaymore==true)
{if(flag==1)towrite=towrite+' | ';towrite=towrite+'<a href="'+posturl+'" class="url" target ="_top">More »</a>';flag=1;;}
document.write(towrite);document.write('</li>');if(displayseparator==true)
if(i!=(numposts-1))
document.write('');}document.write('</ul>');}
//]]>
</script> 

<! -- End Bài viết theo Label - Code 1 -->

 

Bước 3: thêm code vào HTML / Javascript

Thực hiện: vào Bloger - > Bố cục -> Đặt tên hiển thị-> chép code bên dưới vào chổ nội dung -> lưu lại.

<! -- Star Bài viết theo Label - Code 3 -->

<script type='text/javascript'>var numposts = 20;var showpostthumbnails = true;var displaymore = false;var displayseparator = false;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 100;</script>

<script type="text/javascript" src="/feeds/posts/default/-/LABEL?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>

 

<! -- End Bài viết theo Label - Code 3 -->

Lưu ý: Với Bloger thể tùy biến hiển thị bằng cách thay đổi giá trị cụ thể như bên dưới:

- Đặt tên theo nhãn muốn hiển thị

- numposts = 20: Số lượng bài viết sẽ hiển thị

- numchars = 150: Số kí tự của mỗi bài viết được hiển thị.

- LABEL: Tên các bài viết sẽ được hiển thị theo nhãn bạn cần hiện.

 

Có thể thực hiện thay đổi đổi giá trị để đạt mẫu ưng ý nhất nhé!

 

Ảnh hoàn thành sau khi thêm tiện ích

 

Tạm kết: với bài viết mà Blog chia sẽ, hy vọng sẽ giúp Blogger thực hiện thiết kế blog theo mình thật ưng ý.

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

 

 * Đọc thêm:

- Tạo Nhãn (Label) Bài đăng gần đây hay Bài đăng mới. - Điều dưỡng nội tập 1 - Điều dưỡng nội tập 2. - Phác đồ điều trị bệnh tim mạch năm 2018

Share:

Đọc thêm

Cách tạo nút Lên đầu trang (Back to top) cho Blogspot

 

Tạo nút Lên đầu trang (Back to top) cho Blogspot

 

Với Blogpost là nền tảng được miễn phí của Google, bạn có thể tạo blog theo tùy thích. Khi đã có Blog để viết bài đăng trên đó, bạn thấy Blog mình vẫn còn thiếu “Nút quay lên đầu trang” khi đọc đến giữa hay cuối bài viết. Việc tạo nút khá dể dàng, với mình vẫn chưa biết thực hiện. Sau khi tra trên Google và đã thực hiện được, minh xin chia sẻ để các bạn thực hiện cho Blogpost của mình.

 Nút lên đầu trang hay nút Button "Back to Top" rất hữu ích với blogpost. Người đọc không cần phải rê chuột có thể lên đầu trang nhanh chóng. Hãy cùng Blog cách tạo button "Back to Top" cho Blogspot.

Hướng dẫn tạo nút Lên đầu trang (Back to top) cho Blogspot

 

Bước 1:

- Đăng nhập vào trang quản lý Blogger.com -> Chủ đề -> Chỉnh sửa HTML -> Copy toàn bộ code của HTML chép vào Word của bạn để lưu. Khi cần Backup lại trang blog trước khi thực hiện nếu bị lỗi.

- Sau đó các bạn copy mã bên dưới đây vào sau thẻ <head>. Để tìm thẻ này bạn nhấn Ctrl + F rồi nhập vào -> Enter

<link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css' rel='stylesheet'/>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>

Bước 2: Bạn Copy code bên dưới thêm vào trước thẻ </body> (ở gần cuối trang code). Tìm thẻ </body> tương tự như trên.  

<style type='text/css'>
/* Sonar Effect */
@-webkit-keyframes sonar-effect{0%{opacity:0.1}40%{opacity:0.3;box-shadow:0 0 0 5px #fff,0 0 10px 10px #fff,0 0 0 10px #fff}100%{box-shadow:0 0 0 5px #fff,0 0 10px 10px #fff,0 0 0 10px #fff;-webkit-transform:scale(1.5);transform:scale(1.5);opacity:0}}
@keyframes sonar-effect{0%{opacity:0.1}40%{opacity:0.3;box-shadow:0 0 0 5px #fff,0 0 10px 10px #fff,0 0 0 10px #fff}100%{box-shadow:0 0 0 5px #fff,0 0 10px 10px #fff,0 0 0 10px #fff;-webkit-transform:scale(1.5);transform:scale(1.5);opacity:0}}
/* To top */
.vikkatotop{visibility:hidden;z-index:2;background:rgba(52, 152, 219, 0.75);color:#fff;font-size:1.6rem;width:55px;height:55px;line-height:52px;text-align:center;position:fixed;bottom:40px;right:40px;cursor:pointer;-webkit-transform:translateZ(0) scale(0.0) rotate(360deg);transform:translateZ(0) scale(0.0) rotate(360deg);border-radius:100%;opacity:.9;transition:all .4s}
.vikkatotop:hover{background:#3498db;color:#fff;opacity:1}
.vikkatotop.arlniainf{visibility:visible;cursor:pointer;opacity:1;-webkit-transform:translateZ(0) scale(1.0) rotate(0deg);transform:translateZ(0) scale(1.0) rotate(0deg);transition:all .4s;}
.vikkatotop::before{content:'';display:inline-block;position:absolute;width:100%;height:100%;border-radius:100%;top:0;left:0}
.vikkatotop:hover::before{-webkit-animation:sonar-effect 1s ease-in-out .1s infinite;animation:sonar-effect 1s ease-in-out .1s infinite}
.vikkatotop{bottom:20px;right:20px;}
</style>
<div class='vikkatotop hider'>
<i class='fa fa-angle-up'></i>
</div>
<script type='text/javascript'>
//<![CDATA[
// Back to top button
$(function(){$(window).scroll(function(){$(this).scrollTop()>600?$(".vikkatotop").addClass('arlniainf'):$(".vikkatotop").removeClass('arlniainf')}),$(".vikkatotop").click(function(){return $("html,body").animate({scrollTop:0},600),!1})});
//]]>
</script>

 

Bước 3: Chọn “Lưu” và xem lại Blog của mình để tận thành quả.

Tóm lại: với 3 bước đơn giản chúng ta đã thực hiện được “Nút lên đầu trang” hay nút Button “Back to Top” một cách dể dàng. Hãy thực hiện bạn sẽ thành công.

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

Share:

Đọc thêm