Explore Our Collection

Browse through our gallery of expertly-crafted themes to find the perfect one for your needs.

Hiển thị các bài đăng có nhãn Fix Lỗi Blogger. Hiển thị tất cả bài đăng
Hiển thị các bài đăng có nhãn Fix Lỗi Blogger. Hiển thị tất cả bài đăng

Fix lỗi share link website không đúng thumbnails trên Facebook

Chào các bạn đã quay lại với blog star út , hôm nay cũng như mọi khi cứ tối thứ 7 hoặc chủ nhật là mình lại viết blog chia sẻ những thông tin , thủ thuật  mẹo vặt... Đến các bạn nhũng những mà mình tích góp và học hỏi được nhằm mục đích viết lại để dành xem và cũng như chia sẻ đến những bạn nào chưa biết biết đâu được một ngày nào đó các bạn sẽ cần dùng đến. Bài viết hôm nay mình sẽ hướng dẫn các bạn cách fix lỗi link website khi share lên Facebook mà không hiển thị thumbnail hoặc hiển thị không chính xác rất đơn giản chỉ trong vài bước thôi nhé.

Hướng dẫn thực hiện

Bước 1 : các bạn đánh dấu bộ thể meta sau vào dưới thẻ mở <head>
<meta content='https://i.imgur.com/7pSyT95.jpg' property='og:image'/>
Đánh dấu thẻ og:image để cho trình thu thập dữ liệu Facebook hiểu được là bạn muốn link website mà bạn share lên hiển thị theo hình ảnh mà bạn đã đánh dấu ( phần mình tô màu đỏ là link ảnh ).
<meta content='381153792619656' property='fb:app_id'/>
Đánh dấu Facebook app id của bạn để facebook develop dễ dàng theo dõi và thu thập dữ liệu .. Lưu ý : thay dãy số màu đỏ thành app id facebook develop của bạn
<meta content='HMD.LMU.ADMIN.1' property='fb:admins'/> 
Và cuối cùng là facebook admin share link.

Bước 2 : các bạn truy cập vào tools debug sharing tiến hành chép link website của bạn vào để tiến hành yêu cầu facebook develop thu thập lại dữ liệu và tìm lỗi cần fix để facebook thu thập và hiển thị đúng.
Bước 3 : sau khi check vì facebook develop chưa thu thập dữ liệu nên thumbnails vẫn như cũ điều cần làm ngay lúc này là bạn kích vào button yêu cầu thu thập lại từ 1 đến 2-3 lần khi nào hiển thị đúng thumbnails mà bạn yêu cầu thì bạn đã thành công rồi nhé.
Fix lỗi share link website không đúng thumbnails trên Facebook
Hình Minh Họa

Lời kết

Chúc các bạn thành công nhé , nếu không làm được có thể để lại comment bên dưới mình sẽ hỗ trợ thân ái và cảm ơn by star út.

Xem Thêm

Chia Sẻ Bài Viết trên Facebook Dành Cho Quản Trị Viên webSite | helper Facebook Develop

Ý nghĩa

Thủ Thuật Helper Facebook này giải thích cách tối ưu hóa nội dung được lưu trữ trên web mà người dùng chia sẻ trên Facebook, cho dù nội dung này được chia sẻ từ website máy tính để bàn, web di động hay ứng dụng dành cho thiết bị di động nói nôm na là vậy nhé.

Mở thẻ đồ thị

Hầu hết nội dung được chia sẻ trên Facebook dưới dạng URL. Do đó, điều cần thiết là đánh dấu trang web của bạn bằng cách sử dụng các thẻ Open Graph để kiểm soát bố cục nội dung của bạn trên Facebook, Không có các thẻ này, trình thu thập thông tin của Facebook sử dụng phương pháp heuristic nội bộ để thử đoán tiêu đề, mô tả và hình ảnh xem trước tốt nhất cho nội dung của bạn. Xác định rõ ràng thông tin này bằng cách sử dụng thẻ Open Graph để đảm bảo các bài đăng chất lượng cao trên Facebook.
Hình Minh Họa 

Ví dụ tôi gắn thẻ như sau

Ví dụ: dưới đây là cách gắn thẻ bài viết, tin tức hoặc bài đăng trên blog với thuộc tính og:type="article" và một số thuộc tính khác.
<meta property="og:url" content="https://leminhut.blogspot.com/2018/07/huong-dan-them-thu-vien-tim-kiem-tieu-su-xa-hoi-cho-site.html" />
<meta property="og:type" content="article" />
<meta property="og:title" content="HƯỚNG DẪN THÊM THƯ VIỆN TÌM KIẾM TIỂU SỬ XÃ HỘI CHO WEBSITE | profile icon" />
<meta property="og:description" content="THÊM THƯ VIỆN TÌM KIẾM TIỂU SỬ XÃ HỘI CHO WEBSITE" />
<meta property="og:image"

Thẻ cơ bản cần có

  • og:url URL quy định của trang của bạn. Đây phải là URL thô, không có biến phiên, thông tin xác thực người dùng hoặc bộ đếm. Các lượt thích và chia sẻ của URL này được biên dịch tại URL này. Ví dụ, URL miền di động phải trỏ đến phiên bản máy tính để bàn của URL như URL quy định để biên dịch các tài liệu tham khảo tôi thích và chia sẻ trải rộng trên các phiên bản khác nhau của trang
  • og:title Tiêu đề bài viết của bạn không có bất kỳ dấu hiệu nào như tên trang web của bạn.
  • og:description Mô tả ngắn về nội dung, thường là từ hai đến bốn câu. Nó xuất hiện dưới tiêu đề của ấn phẩm trên Facebook
  • og:image URL của hình ảnh xuất hiện khi người dùng chia sẻ nội dung trên Facebook. Để biết thêm thông tin, xem phần bên dưới . Bạn cũng có thể xem hướng dẫn đề xuất của tôi để tìm hiểu cách chỉ định hình ảnh xem trước chất lượng.
  • fb:app_id Để sử dụng Facebook Insights , bạn phải thêm ID ứng dụng vào trang của mình. Thông tin chi tiết cho phép bạn xem phân tích lưu lượng truy cập giữa Facebook và trang web của bạn. Tìm ID ứng dụng trong Không gian ứng dụng của bạn .

    Kiểm tra thẻ cỦa bạn

    • Cách xem các thẻ của bạn được Lập chỉ mục trong robot chỉ mục Facebook 
    • Cách kiểm tra xem lỗi chỉ mục chia sẻ hãy nhập URL Trong Trình Gỡ Lỗi Chia Sẻ Bạn sẽ thấy các thẻ meta mà robot lập chỉ mục truy xuất, cũng như bất kỳ lỗi hoặc cảnh báo nào, Trình gỡ rối cũng kích hoạt khôi phục trang của bạn, vì vậy nếu bạn có lỗi trong mã HTML, bạn có thể sử dụng trình gỡ rối để cập nhật nội dung của mình.
    Hình minh họa khi không tối ưu article:author của Facebook develop.

    Các loại nội dung đa phương tiện 

    • og:video URL của video. Nếu bạn muốn video được đọc trực tuyến trong nguồn cấp tin tức, bạn phải sử dụng URL https: // nếu có thể.
    • og:video:url Tương đương với tham số og:video
    • og:video:secure_url URL an toàn của video. Bao gồm cài đặt này ngay cả khi bạn đặt URL bảo mật og:video.
    • og:video:type Loại Mime của video. application/x-shockwave-flash hoặc video/mp4
    • og:video:width Chiều cao của video tính bằng pixel. Thuộc tính này là bắt buộc đối với video.
    • og:image Cho biết hình ảnh để biết tổng quan về chất lượng trong nguồn cấp tin tức.

    Lời kết

    Chúc các bạn vui vẻ nhé , vui thì thành công tốt đẹp sẻ đến với các bạn oke nhé..

    DMCA.com Protection Status

    Blog Thiếu Thẻ H1 | Cách Tối Ưu Thẻ H1 Chuẩn

    Mình thấy đa số các bạn làm về blogger thường thì các bạn tối ưu những thứ mình thấy được , và ít khi ai để ý những thứ ẩn bên trong nó , vẫn còn một số bạn cải tiến seo cho blogger mình thường thấy ít quan tâm đến thẻ h1 tiêu đề lắm đa số các bạn chỉ tối ưu những cái lỗi mà ta nhìn thấy được , thật buồn vì mọi người lại quên cái cốt lỗi cốt yếu bên trong đưa site ta lên có điểm + Google webmaster.

    Nguyên nhân lỗi

    Thực ra thẻ H1 là thẻ header của blog, thông thường các bạn để title dạng chữ thì blog bạn sẻ có thẻ H1 nhưng khi bạn thay nó thành logo thì blog bạn lại không còn thẻ H1 nữa . các bạn có thể check seo nó bằng công cụ Seo tester online bạn sẻ biết được blog mình có hay không nhé .

    Trường hợp 1 không sử dụng logo hình ảnh

    Bước 1 :  các bạn vào chỉnh sửa mẫu tìm đến thẻ sau .
    <div id='header-wrapper'>
     Và thay chúng thành đoạn code như sau
    <div id='header-wrapper' itemscope='itemscope' itemtype='http://schema.org/Organization'>
     Bước 2 : tìm đoạn html sau
    <!--No header image -->
    <div id='header-inner'>
    <div class='titlewrapper'>
    <h1 class='title'>
    <b:include name='title'/>
    </h1>
    </div>
    Và thay nó thành như sau
    <!--No header image -->
    <div id='header-inner'>
    <div class='titlewrapper'>
    <b:if cond='data:blog.pageType == "index"'>
    <h1 class='title'>
    <b:include name='title'/>
    </h1>
    <b:else/>
    <h3 class='title'>
    <b:include name='title'/></h3>
    </b:if>
    </div>

    Trường hợp 2 Sử dụng logo thay cho title blog

    Bước 1 : các bạn cần tìm đoạn code sau trong phần chỉnh sửa html của blog.
    <!--Show the image only-->
    <div id='header-inner'>
    <a expr:href='data:blog.homepageUrl' style='display: block'>
    <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + "_headerimg"' expr:src='data:sourceUrl' expr:width='data:width' style='display: block' title=''/>
    </a>
    <!--Show the description-->
    Sau đó các bạn chỉ thay ở chỏi thẻ mở <a đến thẻ đóng </a> thôi nhé ví dụ : 
    <a expr:href='data:blog.homepageUrl' style='display: block'>
    ......đến........
    </a>
     Và thay chúng thành đoạn code sau
    <b:if cond='data:blog.pageType == "index"'>
    <h1 itemprop='name'>
    <a expr:href='data:blog.homepageUrl' itemprop='url' style='display: block'>
    <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + "_headerimg"' expr:src='data:sourceUrl' expr:width='data:width' itemprop='logo' style='display: block'/><span><data:blog.title/></span></a>
    </h1>
    <b:else/>
    <h3 itemprop='name'>
    <a expr:href='data:blog.homepageUrl' itemprop='url' style='display: block'>
    <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + "_headerimg"' expr:src='data:sourceUrl' expr:width='data:width' itemprop='logo' style='display: block'/><span><data:blog.title/></span></a></h3>
    </b:if>

    Chỉnh SỬa lại css đôi chút

    Bước 1 : tìm css sau trong mẫu
    .header h1 a {.....}
    Và đổi chúng thành như sau
    .header h1 a,.header h3 a {.....}
    Bước 2 : sau đó thêm đoạn css sau vào blog bạn và lưu lại , kiểm tra xem.
    .header h1 a,.header h3 a, .header h1 a:visited, .header h3 a:visited{color:#fff; font-size:1px;text-decoration:none;margin:0;padding:0}
    .header h1 span, .header h3 span{text-indent:-999em; display:block;}
     Sau khi đã tối ưu , hình minh họa
    Ở đây : nếu muốn được 100/100 thì  chỉ cần để thẻ title trùng với các phần còn lại là được ví dụ : 
    <title> STAR ÚT BLOG | Thủ thuật BLOG, Thủ thuật Seo, Thủ thuật Facebook </ title>
    Nhưng vì trong bộ meta mình đã có rồi nên thẻ title mình không để quá dài nhé :))
    Hình minh họa thẻ H1 phần nội dung đã tối ưu hóa

    Trường hợp 3 không có thẻ <H1>

    Trường hợp này cũng khá đơn giản thôi , các bạn chỉ việc tìm đến đoạn code sau 
    <div id='header-inner'>
    <a expr:href='data:blog.homepageUrl' style='display: block'>
    <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + "_headerimg"' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/>
    </a>
    Và thay chúng thành đoạn code như sau là được.
    <div id='header-inner'>
    <b:if cond='data:blog.url == data:blog.homepageUrl'>
    <h1 expr:href='data:blog.homepageUrl' style='display: block'>
    <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + "_headerimg"' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/>
    </h1>
    <b:else/>
    <a expr:href='data:blog.homepageUrl' style='display: block'>
    <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + "_headerimg"' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/>
    </a>
    </b:if>

    Lời kết

    Chúc các bạn thành công nhé , nếu thấy hay share hộ phát nhé .
    DMCA.com Protection Status