API を使用せずに Instagram の写真を Web サイトに追加する方法

過去に、通常はホームページの下部にある Instagram 投稿のブロックを含む Web サイトに出くわしたことがあるかもしれません。 たとえば、この英国を拠点とする写真サイトには、ホームページの下部にタイル状に並べられた Instagram の写真がたくさんあるバーがあります。 彼らの Instagram フィードに直接アクセスすると、最新の投稿がグリッド状に並んでいることがわかります。 彼らが新しいものを投稿するたびに、新しい写真がウェブサイトにも表示されます.

これは、Instagram を視覚に重点を置いた Web サイトに統合するための非常に優れた方法です。 最近の投稿を自慢し、誰でもクリックして探索できるように、Instagram アカウントへの既成のリンクを用意します。

この種の設定は魅力的で、ウェブサイトの訪問者を Instagram ページに誘導するのに非常に役立ちます。 ただし、実際の設定は思ったよりも複雑です。

インスタグラム API

さて、あなたは私に「利用可能なプラグインの 1 つを使用してみませんか?」と言うかもしれません。 答えは、一般的に「すぐに行く」です。 これらのフィード表示オプションを提供するプラグインはたくさんあります。それらについては、この投稿の最後で説明します。

これが問題です。 これらのプラグインはすべて、Instagram API を使用してコンテンツにアクセスし、公式の埋め込み用のデータを取得する必要があります。 API を使用していない場合は、ページをスクレイピングする必要があります。通常、ページをスクレイピングすることは、Instagram などのサイトの利用規約に反します。 結局のところ、彼らはコンテンツ泥棒などに対処したくありません。

それが起こらないと言っているわけではありません。 Instagramをスクレイピングするだけの何十ものWebサイトを見たことがあると思います. Picdeer、Pictame、Piknow などのサイトには興味深い歴史があります。

数年前、Instagram は単なるモバイル プラットフォームでした。 Instagram アプリ以外から直接アクセスする方法はありませんでした。 つまり、デスクトップ プラットフォームはサイトを使用できず、ビジネス アクセスがかなり制限されていました。

多くの人がモバイル デバイスやモバイル アプリを使用せずに Instagram フィードにアクセスしたいと考えたため、これらのサイトはすべて誕生しました。 彼らがしたことは、Instagram の投稿をスクレイピングして公開することだけでした。

最終的に、Instagram はネットワークをデスクトップから見えるようにしましたが、実行できるアクションの形式はまだ制限されています。 例として、現時点ではデスクトップから投稿することはできません。

これらのサイトはいずれも公式にサポートされておらず、Instagram API を使用していませんでした。 彼らがしたことは、カスタム アプリを使用してコンテンツをスクレイピングしただけでした。 さて、Instagram はこれらを好まなかったので、プラットフォームを公開することで対抗することができました。 多くは一晩で消えてしまいましたが、上記のもののようにまだ存在しているものには、いくつかの追加機能が追加されています. 異なる種類のコンテンツ検索、新しいコンテンツをブラウズして発見する方法、またはコンテンツを表示するための独自の方法を備えている可能性があります。 重要なのは、コンテンツをスクレイピングして表示するのではなく、付加価値を提供することを余儀なくされたということです。

これはすべて、基本的に要点を説明するためのものです。 スクレイピングは技術的には Instagram の利用規約に違反している可能性がありますが、スクレイピングを行っているサイトに対して実際に多くの起訴やその他の措置を講じているわけではありません。 以下に示すいくつかのオプションには、このような手動スクレイピングが含まれているため、それが懸念される理由がわかります.

ただし、主要な質問に戻ります。 これらのプラグインのいずれかを使用しないのはなぜですか? まあ、Instagram API は気まぐれです。 実際、2018 年 12 月に Instagram は API を大幅に変更し、古いバージョンを非推奨にしました。 このページの上部にある大きな免責事項/警告をご覧ください。 API を使用しているブランドが受け取った警告はこれだけでした。

現在、Instagram フィードを表示するために見つけたプラグインは、Instagram API またはスクレイピングに依存しています。 インスタグラムがスクレイパーに対して行動を起こすと、それらのプラグインは消滅します。 Instagram が API を大幅に変更すると、それらのプラグインは機能しなくなります。 いずれにせよ、Instagram が行った変更に合わせてコードを調整するためにサードパーティに依存していることになりますが、これは信頼できない可能性があります。

後でいくつかのプラグインをリストするつもりです。なぜなら、それらは最新の状態に保たれ、Instagram の変更後も機能することが証明されているからです。 ただし、代わりに別のソリューションが機能する可能性があることに注意してください。

これらのプラグインに問題がある可能性があるもう 1 つの理由は、独自のアクセスではなく、あなたのAPI アクセスが必要な場合です。 API アクセスを使用してレート制限を回避する人もいます。 圧倒される可能性のある一元化されたアクセスではなく、各個人の API アクセスでコンテンツをフェッチします。 ここでの問題は、何らかの理由で API アクセスが取り消された場合、これらのプラグインを使い続けることができなくなることです。

それでもInstagramのコンテンツをWebサイトに表示することにまだ興味がある場合は、非常に便利で本当にクールです.

オプション 1: 偽装する

あなたが持っている最初のオプションは、多くの手作業でそれを偽造することです. 難しいことではありませんが、時間がかかる可能性があり、Instagram アカウントとウェブサイトの「埋め込み」を同等に保ちたい場合は、これを行う必要があります。 技術的には埋め込みでさえないため、ここでは埋め込みを恐怖の引用符で囲みます。

では、この方法はどのように機能するのでしょうか。 おそらく、デジタル カメラで写真を撮り、コンピューターで編集してから、モバイル デバイスにアップロードして Instagram に投稿しているでしょう。 それらを編集している間に、2 つのコピーを作成します。 1部は通常通りインスタグラムにアップします。 もう 1 つのコピーは、Web ホスティングにアップロードされます。

コンテンツを Instagram に投稿すると、Instagram 投稿が作成されます。 これには、キャプション、パーマリンク、および関連するその他の情報が含まれます。 その投稿を作成して公開します。

次に、Web サイトに移動し、Instagram コンテンツを配置するグリッドを作成します。 写真を Web ホストにアップロードし、グリッドのセルの 1 つに埋め込みます。 パーマリンクを Instagram 投稿にコピーし、写真をリンクにします。 ホバー スクリプトを使用して画像キャプションを表示するものが必要な場合は、もう少しコーディングが必要になりますが、キャプションをコピーして貼り付けることもできます。

このオプションには 2 つの大きな欠点があります。 1 つ目は、時間がかかることです。これは、Instagram に投稿する各画像について覚えておく必要があることです。 画像を Web サイトにアップロードするのを忘れて、すべての画像をグリッドの下に移動し、新しい画像を最初のスロットに追加すると、フィードの外観が変わってしまいます。

2 つ目の大きな欠点は、ホスティングのスペースを占有することです。 Instagram API アクセスまたはスクレイピングを使用する利点は、画像が引き続き Facebook CDN でホストされていることです。つまり、独自のサーバー リソースを使用する必要なく、画像がすばやく読み込まれます。 この偽の埋め込みオプションには、その利点はありません。

オプション 2: 手動埋め込み

2 番目に考えられるオプションは、カスタム コードと Instagram からの手動埋め込みを使用することです。 すべての Instagram 投稿には、それを埋め込むオプションがあります。 投稿をクリックし、キャプションの右上にある 3 つのドットをクリックすると、オプションの 1 つが埋め込みです。 これは、いくつかの長いコードをコピーし、Instagram API を使用します。 ここでの主な利点は、API を使用しているにもかかわらず、API が Instagram のコア機能であり、変更される可能性が低いことです。 Instagram が API を変更するときは、自社のサービスが影響を受けないようにします。

投稿を自分のサイトに埋め込むと、通常はフル サイズで表示され、投稿のキャプションが表示されますが、必要に応じてキャプションを含めないようにすることもできます。 これは明らかに、複数の画像の小さなグリッドには理想的ではありません。 この方法で表示するには、カスタム コードを使用して画像を縮小および配置する必要があります。

これは基本的にマニュアルであり、サードパーティのプラグインを使用しない方法でグリッドを作成するフープ メソッドをジャンプします。 Instagram の各投稿をホストしますが、カスタム コードが必要であり、一種の厄介なソリューションです。 新しい投稿を追加するたびに、投稿をグリッドの下に手動でシフトする必要があり、投稿ごとに埋め込みコードを手動でフェッチする必要があります。 さらに、多くの埋め込みをすべて同じ場所に追加すると、読み込み時間が大幅に長くなる可能性があります. 全体として、これは実際には最良の選択肢ではありません。

オプション 3: サードパーティのスクレーパーを使用する

前述したように、Instagram をスクレイピングするのは必ずしもそれほど難しくありません。 サードパーティのスクレイパー サービスを使用してデータを提示し、そのデータを任意の方法でフォーマットしてサイトに埋め込むことができます。

たとえば、Feedity は、そのようなサードパーティのスクレーパー サービスの 1 つです。 これにより、カスタム スクレイパー インターフェースに Web ページをロードし、どのデータを探して、変更されたときにスクレイピングするかを選択できます。 この場合、Feedity は具体的にそのデータを RSS フィードとしてフォーマットします。

その後、その RSS フィードを使用してページにコンテンツを埋め込むことができます。 サイトの設計に応じて、いくつかの異なる方法でこれを行うことができます。 これは、サイトが WordPress アーキテクチャを使用している場合に、RSS フィードを取得し、コンテンツと画像の両方をサイトに埋め込むためのチュートリアルです。 一方、このチュートリアルでは、単純な HTML および PHP コーディングを使用して、従来のサイト デザインに対して同じことを行います。

このオプションは、いくつかの理由で理想的とは言えません。 まず、Web サイトに大量のカスタム コーディングが必要です。 自分でコーディングの経験がない場合は、開発者を雇う必要があり、費用がかかる可能性があります。

さらに、スクレイピングを行うためにサードパーティのサービスに依存し、それが Instagram で機能することに依存しています (これは注意が必要です)。また、Instagram がサイトのデザインを変更して、正確な種類のスクレイピングの試みを妨げないようにしています。 実際のところ、Instagram はスクレイパーが好きではありません。彼らはスクレイパーを個別に追跡するわけではありませんが、彼らの生活を困難にしています。

オプション 4: カスタム スクレーパーの作成

もちろん、スクレイピングのセットアップはそれほど難しくありません。 さまざまなスクレイピング ソリューションが存在するため、スクレイピングは難しいように思えるかもしれませんが、それらはすべて、サービスをビジネスとして販売するために「万能」であろうとしています。 自分で何かをスクレイピングするだけなら、コードはかなり単純になる可能性があります。 次に、Instagramを1日1回スクレイピングするコードを作成し、データを好きなようにフォーマットし、独自のカスタム埋め込みを設定するだけです.

他のいくつかのオプションと同様に、これには多くの個人的なコーディングや開発者の時間が必要であり、理想的ではありません. コードを書くのが好きなら自分でできますが、ファンでなければ開発者にお金を払う必要があります。 また、Instagram がサイトを変更してスクレイピングを難しくしていることにも対処する必要があります。これは数か月ごとに定期的に行われます。 あなたがこれと戦う意思があるなら、それを選んでください。 それ以外の場合は、別のオプションを検討してください。

オプション 5: プラグインの使用

以前にプラグインを使用してはいけない理由について説明したことは知っていますが、それでも検討することができます。 一部のプラグインは、変更に対応するのが得意で、機能するために API を必要とせず、簡単にセットアップできます。

次の選択肢を検討してください: EmbedSocial、Juicer、SnapWidget、および Elfsight。 これらはすべて、最小限のセットアップで目的を達成するためのオプションです。 もちろん、それらには独自の特典と欠点があり、それらのいくつかは無料ではありませんが、それはあなたが調べる必要があるものです.