আমার ইউআরএল ভাগ করার সময় ফেসবুক শেয়ারার কীভাবে চিত্রগুলি এবং অন্যান্য মেটাডেটা নির্বাচন করবেন?

393

ফেসবুক শেয়ারার ব্যবহার করার সময়, ফেসবুক ব্যবহারকারীকে তাদের লিঙ্কের পূর্বরূপ হিসাবে উত্স থেকে টানা কয়েকটি চিত্রের 1 ব্যবহার করার বিকল্প সরবরাহ করবে। এই চিত্রগুলি কীভাবে নির্বাচিত হয় এবং আমি কীভাবে নিশ্চিত করতে পারি যে আমার পৃষ্ঠার কোনও নির্দিষ্ট চিত্র সর্বদা এই তালিকায় অন্তর্ভুক্ত রয়েছে?

facebook  facebook-opengraph  facebook-sharer 
— স্যাম্পসন
সূত্র
এটি মেটা সম্পত্তি ব্যবহার করার সময় সত্যই কার্যকর হয় তবে এটি অবৈধ এইচটিএমএল, যা আমি খুব অদ্ভুত বলে মনে করি! এটি কোনও বৈধকারকের মাধ্যমে চালানোর চেষ্টা করুন এবং আপনি দেখতে পাবেন। এটি আমাকে অবাক করে দেয় কেন পৃথিবীতে তারা বৈধ এইচটিএমএল নিয়ে কাজ করতে পারে না ??
1
দেখতে developers.facebook.com/docs/opengraph আরো og = ": <HTML xmlns opengraphprotocol.org/schema " ...
— cope360
3
টিপ- পরিবর্তনগুলি করার পরে .. আপনার পৃষ্ঠাটি লান্টার এবং ফেসবুকের মাধ্যমে চালান সেই পৃষ্ঠা বিকাশকারীদের
আমি নীচের নিবন্ধটিও খুব দরকারী বলে খুঁজে পেয়েছি: কোন ইউআরএল, পাঠ্য এবং আইএমজি ভাগ করে
— নেওয়ার পদ্ধতিটি

উত্তর:

593

আমার পৃষ্ঠাটি ভাগ হয়ে গেলে আমি কোন চিত্রটি ফেসবুককে বলব?

ফেসবুকের ওপেন-গ্রাফ মেটা ট্যাগগুলির একটি সেট রয়েছে যা কোন চিত্রটি প্রদর্শিত হবে তা স্থির করে।

ফেসবুক চিত্রের জন্য কীগুলি হ'ল:

<meta property="og:image" content="http://ia.media-imdb.com/rock.jpg"/>
<meta property="og:image:secure_url" content="https://secure.example.com/ogp.jpg" />

এবং এটি <head></head>আপনার পৃষ্ঠার শীর্ষে ট্যাগের মধ্যে উপস্থিত থাকা উচিত ।

এই ট্যাগ উপস্থিত না থাকে, এটি একটি ইমেজ উল্লেখ তাদের পুরোনো পদ্ধতির জন্য দেখতে হবে: <link rel="image_src" href="https://stackoverflow.com/myimage.jpg"/>। যদি উভয়ই উপস্থিত না থাকে, ফেসবুক আপনার পৃষ্ঠার বিষয়বস্তুটি অনুসন্ধান করবে এবং আপনার পৃষ্ঠা থেকে এমন চিত্রগুলি চয়ন করবে যা তার ভাগ করে নেওয়ার চিত্রটির মান পূরণ করে: চিত্রটি অবশ্যই কমপক্ষে 200px দ্বারা 200px হওয়া উচিত, সর্বাধিক 3: 1 অনুপাতের অনুপাত থাকতে হবে, এবং পিএনজিতে, জেপিগ বা জিআইএফ ফর্ম্যাট।

ব্যবহারকারীকে কোনও চিত্র নির্বাচন করার অনুমতি দিতে আমি একাধিক চিত্র নির্দিষ্ট করতে পারি?

হ্যাঁ, আপনাকে কেবল একাধিক চিত্রের মেটা ট্যাগগুলি যাতে উপস্থিত হতে চান সেগুলি যুক্ত করতে হবে then তারপরে ব্যবহারকারীকে একটি চিত্র নির্বাচক ডায়ালগের সাথে উপস্থাপন করা হবে:
ফেসবুক ইমেজ নির্বাচনকারী

আমি যথাযথ চিত্রের মেটা ট্যাগগুলি নির্দিষ্ট করেছি। ফেসবুক কেন পরিবর্তনগুলি গ্রহণ করছে না?

একবার ইউআরএল ভাগ হয়ে গেলে ফেসবুকের ক্রলার, যার ব্যবহারকারী এজেন্ট রয়েছে facebookexternalhit/1.1 (+https://www.facebook.com/externalhit_uatext.php), আপনার পৃষ্ঠায় অ্যাক্সেস করবে এবং মেটা তথ্য ক্যাশে করবে। ফেসবুক সার্ভারকে ক্যাশে সাফ করার জন্য বাধ্য করার জন্য, ক্যাশে রিফ্রেশ করতে এবং আপনার পৃষ্ঠায় কোনও মেটা ট্যাগ সংক্রান্ত সমস্যা সমাধানের জন্য তারা জুন ২০১০ এ চালু করা ফেসবুক আরল ডিবাগার / লিন্টার সরঞ্জামটি ব্যবহার করুন ।

এছাড়াও, পৃষ্ঠায় থাকা চিত্রগুলি অবশ্যই ফেসবুক ক্রলারে সর্বজনীনভাবে অ্যাক্সেসযোগ্য। আপনাকে কেবল /yourimage.jpg এর পরিবর্তে http://example.com/yourimage.jpg এর মতো পরম ইউআরএলগুলি নির্দিষ্ট করা উচিত ।

আমি কি জাভা স্ক্রিপ্ট বা jQuery এর মতো ক্লায়েন্ট সাইড কোডের সাথে এই মেটা ট্যাগগুলি আপডেট করতে পারি? না। অনেকগুলি সার্চ ইঞ্জিন ক্রলারের মতো, ফেসবুক স্ক্র্যাপ স্ক্রিপ্টগুলি কার্যকর করে না তাই পৃষ্ঠা ডাউনলোড করার সময় যা কিছু মেটা ট্যাগ উপস্থিত থাকে তা হ'ল মেটা ট্যাগ যা চিত্র নির্বাচনের জন্য ব্যবহৃত হয়।

এই ট্যাগগুলি যুক্ত করার ফলে আমার পৃষ্ঠা আর বৈধ হবে না। আমি এটা কিভাবে ঠিক করবো?

আপনি আপনার ট্যাগটিতে প্রয়োজনীয় ফেসবুকের নেমস্পেস যুক্ত করতে পারেন এবং আপনার পৃষ্ঠার পরে বৈধতা দেওয়া উচিত:

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:og="http://ogp.me/ns#"
      xmlns:fb="https://www.facebook.com/2008/fbml">
— bkaid
সূত্র
1
দেখতে অন্য একটি জায়গা: <link rel="apple-touch-icon" href="...">(এটি
— এটিরূপে
2
@ ইয়্যারিন আমি নিশ্চিত নই যে এটি সত্য। স্ট্যাকওভারফ্লোতে ইমেজ_সিআরসি সম্পত্তি সেট রয়েছে যা এটি ব্যবহার করছে। আপেল-টাচ-আইকনটির ফাইলের নামটি আলাদা এবং ব্যবহার হচ্ছে না।
— বিকেইড
3
আমি কি চিত্রটি অর্ডার চয়ন করতে পারি? আমার ক্ষেত্রে, মেটা ট্যাগগুলির চিত্রের আগে আরও একটি চিত্র উপস্থিত হয়।
— ভিসানরেলে
23
নূন্যতম চিত্রের আকার এখন 200x200px।
— Tr1stan
1
Woot! আমি img এর আকার 300px এ সেট করেছি, এখন মনে হচ্ছে এটি কাজ করে। ধন্যবাদ @ Tr1stan
— ওরস
37

আপনি যখন ফেসবুকের জন্য ভাগ করেন, আপনাকে পরবর্তী এই মেটা ট্যাগগুলির প্রধান বিভাগে আপনার এইচটিএমএল যুক্ত করতে হবে: 

<meta property="og:title" content="title" />
<meta property="og:description" content="description" />
<meta property="og:image" content="thumbnail_image" />

এবং এটাই!

এফবি আপনাকে যা বলে তা অনুযায়ী আপনার বোতামটি যুক্ত করুন।

আপনার প্রয়োজনীয় সমস্ত তথ্য www.facebook.com/share/ এ রয়েছে

— matias
সূত্র
28

২০১৩ অবধি, আপনি যদি ফেসবুক.com/sharer.php (পিএইচপি) ব্যবহার করে থাকেন তবে আপনি যে কোনও বোতাম / লিঙ্কটি সহজেই তৈরি করতে পারেন:

<a class="btn" target="_blank" href="http://www.facebook.com/sharer.php?s=100&amp;p[title]=<?php echo urlencode(YOUR_TITLE);?>&amp;p[summary]=<?php echo urlencode(YOUR_PAGE_DESCRIPTION) ?>&amp;p[url]=<?php echo urlencode(YOUR_PAGE_URL); ?>&amp;p[images][0]=<?php echo urlencode(YOUR_LINK_THUMBNAIL); ?>">share on facebook</a>

লিঙ্ক ক্যোয়ারী পরামিতি:

p[title] = Define a page title
p[summary] = An URL description, most likely describing the contents of the page
p[url] = The absolute URL for the page you're sharing 
p[images][0] = The URL of the thumbnail image to be used as post thumbnail on facebook

এটি সহজ সরল: আপনার কোনও জেএস বা অন্যান্য সেটিংসের দরকার নেই। এটি কেবল একটি HTML কাঁচা লিঙ্ক। আপনি যেভাবে চান কোনও ট্যাগকে স্টাইল করুন।

— আন্তোনিও ম্যাক্স
সূত্র
p[images][0]আমার যা দরকার ছিল ঠিক তাই ছিল ogট্যাগগুলি একই চিত্র ভাগ করার জন্য কাজ করে তবে একই পৃষ্ঠা থেকে আমার একাধিক চিত্র ভাগ করা দরকার।
— thekingoftruth
4
এটি নতুন 'স্বীকৃত উত্তর' হওয়া উচিত - এত সহজ এবং সোজা। এই জন্য ধন্যবাদ, সাথী।
— মাইক
অ্যান্টোনিও, আপনি উপরে যা দেখালেন তার কোনও উত্সের লিঙ্ক আছে? আমি developers.facebook.com এই চেহারা চেষ্টা করছি কিন্তু ছাড়া কিছু খুঁজে পেতে অসমর্থ এই । সাহায্য করুন.
— মিঃগ্রিন
@ মিঃ গ্রীন এটি সম্পর্কে এই বৈশিষ্ট্যটি 'অবচিত' ছিল তবে এখন সরকারী ডক্সে ফিরে এসেছে। যাইহোক, আমি বিশ্বাস করি আমার উত্তর এটিতে কাজ করার জন্য প্রাথমিক সেটিংসকে coversেকে রাখে।
— আন্তোনিও ম্যাক্স
@ অ্যান্টোনিওম্যাক্স দয়া করে s=100আপনার পোস্টে কী তা ব্যাখ্যা করুন ?
— মিঃগ্রিন
12

আমার অভিজ্ঞতা থেকে, http://www.facebook.com/sharer.php মেটা ট্যাগ ব্যবহার করে না। এটি আপনার পাস করা স্ট্রিংটি ব্যবহার করে। নিচে দেখ.

http://www.facebook.com/sharer.php?s=100&pebttlele== এটি আমার শিরোনাম এবং পি [সারাংশ] = এটি আমার সংক্ষিপ্ত বিবরণ এবং পি [url] = http: //www.MYURL.com&&p [চিত্র] 0] = HTTP: //www.MYURL.com/img/IMAGEADDRESS

মেটা ট্যাগগুলি ফেসবুকের বিকাশকারীদের সাথে বাটনগুলি প্রেরণের / পাঠানোর মতো অন্যান্য ওপেন গ্রাফের তথ্য মতো কাজ করে। সুতরাং আপনি যদি মন্তব্যগুলির মতো ফেসবুকের আসল উপাদানগুলির মধ্যে একটি ব্যবহার করেন এবং এই জাতীয় সমস্ত কিছুই ওপেন গ্রাফ স্টাফের সাথে যুক্ত করে।

আপডেট:? আছে ভাগীদার ব্যবহার করার দুটি উপায় * দ্রষ্টব্য গুলি বনাম তোমার দর্শন লগ করা কোয়েরি স্ট্রিং মান হয়
: 1 ==> STRING এর http://www.facebook.com/sharer.php?s উপরে + থেকে বিষয়বস্তু
~ ~> স্ট্রিং থেকে তথ্য টানবে।
2 ==> ইউআরএল: http://www.facebook.com/sharer.php?u=url যেখানে url একটি আসল url- র সমান
~~> url মান প্রদত্ত পৃষ্ঠাটি স্ক্র্যাপ করবে
~~> আপনি মানগুলি পরীক্ষা করতে পারবেন এখানে: https://developers.facebook.com/tools/debug

— জেসন লিডন
সূত্র
খুব উপকারী. ধন্যবাদ! : ডি
— অ্যারন গ্রে
কোনও ইউআরএল থেকে বিষয়বস্তু পেতে অন্য কোনও ওয়েবসাইটে সেই অংশীদারকে ব্যবহার করার কোনও আইনী উপায় আছে কি? আমি ফেসবুক এপিআই এবং স্টাফ সম্পর্কে খুব বেশি জানি না ...
— লাইথ
ইউআরএল বিকল্পটি ব্যবহার করে দেখুন। পৃষ্ঠাটিতে যদি ওজি ট্যাগ থাকে তবে এফবি তাদের স্ক্র্যাপ করে দেবে। আপনি এখানে যে
— পৃষ্ঠাগুলি
11

পুরানো উপায়, আর কাজ করে না:

<link rel="image_src" href="http://yoururl/yourimage"/>

নতুনভাবে রিপোর্ট করা হয়েছে, এছাড়াও কাজ করে না:

<meta property="og:image" content="http://yoururl/yourimage"/>

এটি এলোমেলোভাবে কাজ করেছে এবং প্রথম দিনটিতে আমি এটি প্রয়োগ করেছি, তখন থেকে কোনও কাজ হয়নি।

আপনার পৃষ্ঠাটি পরিদর্শন করে এমন একটি ইউটিলিটি ফেসবুক লিন্টার পৃষ্ঠাটি জানিয়েছে যে সমস্ত কিছু ঠিক আছে এবং আমি নির্বাচিত থাম্বনেলটি প্রদর্শন করি ... কেবল যে ভাগ.এফপি পাতা নিজেই কাজ করছে বলে মনে হয় না। ফেসবুকে একটি বাগ থাকতে হবে, একটি তারা সম্ভবত তাদের সিস্টেমে দেখেছি এই সমস্যাটি সম্পর্কে সমাধান করা বা স্থির করে দেওয়া এই সমস্যা সম্পর্কিত প্রতিটি বাগ প্রতিবেদন হিসাবে ঠিক করার কোনও যত্ন নেই।

— থিও
সূত্র
আমারও এই সমস্যা হচ্ছে। লিন্টারে কোনও ত্রুটি নেই এবং আমার চিত্রটি সঠিকভাবে দেখায়, তবে আমি যখন আমার সাইটে শেয়ার বোতামটি ক্লিক করি তখন শেয়ার ইন্টারফেসে কোনও চিত্র নেই।
— লুক গ্রিফিথস
image_src আর ফেসবুকের জন্য কাজ করে না, তবে কিছু পরিষেবা এখনও এটি ব্যবহার করে (টেলিগ্রাম ক্লায়েন্টস ইত্যাদি)
— আন্দ্রে এসকে
10

শিরোনাম, বিবরণ এবং চিত্র পরিবর্তন করতে আমাদের হেড ট্যাগের অধীনে কিছু মেটা ট্যাগ যুক্ত করতে হবে।

পদক্ষেপ 1:
হেড ট্যাগের অধীনে মেটা ট্যাগ যুক্ত করুন 

<html>
<head>
    <meta property="og:url" content="http://www.test.com/" />
    <meta property="og:image" content="http://www.test.com/img/fb-logo.png" />
    <meta property="og:title" content="Prepaid Phone Cards, low rates for International calls with Lucky Prepay" />
    <meta property="og:description" content="Cheap prepaid Phone Cards. Low rates for international calls anywhere in the world." />

পরবর্তী পদক্ষেপ:
নীচের লিঙ্কে ক্লিক করুন
https://developers.facebook.com/tools/debug

আপনার URL টি পাঠ্য বাক্সে যুক্ত করুন (উদাঃ http://www.test.com/ ) আপনি ট্যাগগুলি উল্লেখ করেছেন। DEBUG বাটনে ক্লিক করুন।

এটি সম্পন্ন

আপনি এখানে যাচাই করতে পারেন https://www.facebook.com/sharer/sharer.php?u=http://www.test.com/

উপরের url এ, ইউ = আপনার ওয়েবসাইটের লিঙ্ক

উপভোগ করুন !!!!

— Gaurav123
সূত্র
ডিবাগারটি সহায়ক ছিল।
— কনসোলবক্স
1

আমার এই সমস্যা হয়েছিল এবং ম্যানুয়েল -৪৪ এর পরামর্শ দিয়ে এটি ঠিক করেছিলাম। একটি 400x400px চিত্র ব্যবহার করে দুর্দান্ত কাজ করেছে, যখন আমার ছোট চিত্রটি কখনও অংশীদার হিসাবে প্রদর্শিত হয় নি।

নোট করুন যে ফেসবুক সর্বনিম্ন 200px বর্গক্ষেত্র চিত্রকে og: চিত্র ট্যাগ হিসাবে প্রস্তাব দেয়: https://developers.facebook.com/docs/open راف/howtos/maximizing-dist تقسیم-media-content/#tags

— উইলিয়াম
সূত্র
1

এটিই আমার পক্ষে কাজ করেছে: আমি ট্যাগের ডানদিকের পরে পৃষ্ঠায় কাঙ্ক্ষিত থাম্বনেল চিত্রটি রেখেছি এবং এটি দেখতে খুব ছোট করে দিচ্ছি ..

<img src="imagename.jpg" width="1" height="1" />

আমি এটি উচ্চতা 0 এবং প্রস্থ 0 দিয়ে পরীক্ষা করেছি না তবে এটি সম্ভবত এখনও কাজ করবে .. এটি গ্যারান্টি দেয় না যে ব্যবহারকারী এই চিত্রটি নির্বাচন করবেন ..

এছাড়াও মনে হয় ফেসবুক আপনার পৃষ্ঠায় থাম্বনেলগুলি ক্যাশে করে এবং সর্বদা এটি নতুনদের জন্য পরীক্ষা করে না .. এটি আপনার সাইটে অন্য পৃষ্ঠায় যুক্ত করার চেষ্টা করুন এবং আপনি দেখতে পাবেন যে এটি কাজ করে।

— ড্যানিয়েল বার্নাল
সূত্র
1
ট্যাগটির পরে - আপনার অর্থ: "দেহের ট্যাগের পরে"?
— অ্যালেক্সিস উইল্ক
হ্যাঁ, আমি বিশ্বাস করি এটাই তাদের অর্থ। আমি এটি একটি সাইটে অনেক আগে করেছি, তবে style="display:none;"এটি 1x1 পিক্সেলে সেট করার পরিবর্তে ব্যবহার করেছি।
— মাইক
1

কাস্টম চিত্রগুলি দেখানোর জন্য ভাগ করুন ডায়ালগের পরিবর্তে ফেসবুক ফিড ডায়ালগ ব্যবহার করুন Use

উদাহরণ:

https://www.facebook.com/dialog/feed?app_id=1389892087910588
&redirect_uri=https://scotch.io
&link=https://scotch.io
&picture=http://placekitten.com/500/500
&caption=This%20is%20the%20caption
&description=This%20is%20the%20description
— kittu
সূত্র
0

আমি নির্দিষ্ট পোস্ট থেকে ফেসবুককে সঠিক চিত্র বাছাই করতে পারি না, তাই এই পৃষ্ঠায় যা বর্ণিত হয়েছে তা আমি করেছি:

/webapps/18468/adding-meta-tags-to-individual-blogger-posts

অন্য কথায়, এরকম কিছু:

<b:if cond='data:blog.url == "http://urlofyourpost.com"'>
  <meta content='http://urlofyourimage.png' property='og:image'/>
 </b:if>

মূলত, আপনি যে কোনও পোস্টের জন্য যা কিছু পরিবর্তন করেছেন তার জন্য মেটা সামগ্রী পরিবর্তন করার জন্য এটি আপনার সাইটের এইচটিএমএল-তে একটি বিবৃতিতে হার্ড কোড যাচ্ছেন। এটি একটি অগোছালো সমাধান, তবে এটি কার্যকর।

— মিশেল গ্লাউজার
সূত্র
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.