{"id":21204,"date":"2020-08-05T15:13:56","date_gmt":"2020-08-05T15:13:56","guid":{"rendered":"http:\/\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app"},"modified":"2025-05-04T14:41:46","modified_gmt":"2025-05-04T21:41:46","slug":"display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app","status":"publish","type":"post","link":"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app","title":{"rendered":"Display Instagram and Google+ profile pictures in your website and mobile app"},"content":{"rendered":"<div style=\"border-radius: 3px 7px 7px 3px; color: #3c3c3c; font-size: 14px; padding-bottom: 0; padding-left: 4px; margin-top: 20px; margin-bottom: 20px; background-color: #5bc7ef;\">\n<div style=\"color: #3c3c3c; padding: 18px 22px; background-color: #f4f4f4; border-radius: 1px 6px 6px 1px;\">\n<div style=\"padding-bottom: 10px; font-size: 16px; line-height: 24px; font-family: Montserrat; font-weight: 600; color: #5bc7ef;\">Updates since publication:<\/div>\n<ul>\n<li>Following Google&#8217;s shutdown of its legacy Google+ API in March 2019, the Google+ (gplus) option is no longer available.<\/li>\n<li>Following changes made by Instagram in June 2020, the Instagram (instagram_name) option is no longer available.<\/li>\n<\/ul>\n<\/div>\n<\/div>\n<p><!-- Update notice end --><\/p>\n<div><\/div>\n<div>Many modern web and mobile applications include integral social aspects as parts of their online solution.<\/div>\n<div><\/div>\n<div>Users can sign-in to these services and be identified by their chosen social identity. This is made quite straightforward by leveraging single sign-on services such as <strong>Facebook Connect<\/strong>, <strong>Twitter<\/strong>, <strong>Google+<\/strong> and others. After signing in, activities in the service and user generated content can be accompanied with the real name of the users as well as their profile pictures.<\/div>\n<div><\/div>\n<div>In order to display a user&#8217;s social profile picture in your web site, you&#8217;ll need to support all the different APIs provided by the relevant social network, each with its own quirks. You&#8217;ll then probably want to fetch the profile picture to your local server. After that, you&#8217;ll want to modify the picture to match your graphic design&#8217;s dimensions and aspect ratio requirements, apply the relevant transformations (applying circular crops, sharpening, etc.), and remember to update the images on your side when users update their profile pictures on the social network.<\/div>\n<div><\/div>\n<div>Overall, a lot of small things to take care of.<\/div>\n<div><\/div>\n<div>Fortunately, <a href=\"https:\/\/cloudinary.com\" target=\"_blank\" rel=\"noopener\"><strong>Cloudinary<\/strong><\/a> already does all that for you. Simply specify the social profile name or ID using Cloudinary&#8217;s dynamic image URLs and you&#8217;re done. Cloudinary contacts the social network and automatically fetches the profile picture that best matches your display requirements. It then transforms the image on-the-fly to match your graphic design, delivers the image optimized and cached through a fast CDN and refreshes the image periodically in case it was changes on the social network.<\/div>\n<div><\/div>\n<div>This blog post details how you can embed social pictures from <strong>Google+<\/strong> and <strong>Instagram<\/strong>, our latest additions to Cloudinary&#8217;s list of supported social networks (adding to <strong>Facebook<\/strong>, <strong>Twitter<\/strong> and <strong>Gravatar<\/strong>).<\/div>\n<div><\/div>\n<h3>Instagram profile pictures<\/h3>\n<div>Every Instagram user has a unique public user name and a main profile picture. If you know that a piece of content on your site was contributed by a certain Instagram user, you can use Cloudinary&#8217;s delivery URLs to fetch and display their main profile picture side-by-side with their added content.<\/div>\n<div><\/div>\n<div>The following example fetches the profile picture of &#8216;angelinajolieofficial&#8217; while transforming it to fill a 120&#215;120 rectangle, optimizes it and delivers it through a CDN.<\/div>\n<div><\/div>\n<div style=\"text-align: center;\"><strong><a href=\"https:\/\/res.cloudinary.com\/demo\/image\/instagram_name\/w_120,h_120,c_fill\/angelinajolieofficial.jpg\" target=\"_blank\" rel=\"noopener\">&#8230;\/image\/<span style=\"color: #bb0000;\">instagram_name<\/span>\/w_120,h_120,c_fill\/angelinajolieofficial.jpg<\/a><\/strong><\/div>\n<div><\/div>\n<div><img loading=\"lazy\" decoding=\"async\" style=\"margin-left: auto; margin-right: auto;\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/instagram_name\/w_120,h_120,c_fill\/angelinajolieofficial.jpg\" alt=\"120x120 Instagram profile picture\" width=\"120\" height=\"120\" \/><\/div>\n<div><\/div>\n<div>If you use one of our client libraries, all you need to do is to set the image type to &#8216;<strong>instagram_name<\/strong>&#8216;. Here&#8217;s a Ruby on Rails example:<\/div>\n<pre>&lt;%= cl_image_tag('angelinajolieofficial.jpg',\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0:type =&gt; :instagram_name, :width =&gt; 120, :height =&gt; 120, \n                 :crop =&gt; :fill) %&gt;\n<\/pre>\n<div>In the example above, the original Instagram profile picture was displayed while reducing its original dimensions. You can apply any Cloudinary transformation on-the-fly to match the look &amp; feel of your application on any desktop, mobile or retina display. The following example generates a 90&#215;90 circular crop thumbnail of the same photo. Automatic face detection was used to correctly crop the original image. In addition, an automatic <a href=\"https:\/\/cloudinary.com\/blog\/automatic_cloud_based_image_improvements_and_effects\">image improvement filter<\/a> was applied on the generated thumbnail.<\/div>\n<div><\/div>\n<div><strong><a href=\"https:\/\/res.cloudinary.com\/demo\/image\/instagram_name\/w_90,h_90,c_thumb,g_face,r_max,e_improve\/angelinajolieofficial.jpg\" target=\"_blank\" rel=\"noopener\">&#8230;\/image\/instagram_name\/w_90,h_90,c_thumb,g_face,r_max,e_improve\/angelinajolieofficial.jpg<\/a><\/strong><\/div>\n<div><\/div>\n<p><img loading=\"lazy\" decoding=\"async\" style=\"margin-left: auto; margin-right: auto;\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/instagram_name\/w_90,h_90,c_thumb,g_face,r_max,e_improve\/angelinajolieofficial.jpg\" alt=\"Manipulated Instagram profile picture by name\" width=\"90\" height=\"90\" \/><\/p>\n<div><\/div>\n<div><\/div>\n<div>The following PHP code creates the same URL:<\/div>\n<pre>&lt;?php echo cl_image_tag(\"angelinajolieofficial.jpg\",\n             array(\"type\": \"instagram_name\",\n                   \"width\" =&gt; 90, \"height\" =&gt; 90, \"crop\" =&gt; \"thumb\", \n                   \"gravity\" =&gt; \"face\", \"radius\" =&gt; \"max\", \"effect\" =&gt; \"improve\")); ?&gt;\n<\/pre>\n<div><span style=\"font-size: 1.17em;\">Google+ profile pictures<\/span><\/div>\n<div>The Google+ social network strives to be the ultimate Facebook alternative. Using Cloudinary, you can easily embed <strong>Google+ profile pictures<\/strong> in your website and mobile app.<\/div>\n<div><\/div>\n<div>Do that by simply setting the image type to &#8216;<span style=\"color: #bb0000;\"><strong>gplus<\/strong><\/span>&#8216; while building Cloudinary URLs. The images are identified by <strong>Google+ unique numeric ID<\/strong>.<\/div>\n<div><\/div>\n<div>The following URL delivers a 150&#215;150 version of the Google+ profile of Larry Page that has the numeric ID of 106189723444098348646:<\/div>\n<div><\/div>\n<div style=\"text-align: center;\"><strong><a href=\"https:\/\/res.cloudinary.com\/demo\/image\/gplus\/w_150,h_150,c_scale\/106189723444098348646.jpg\" target=\"_blank\" rel=\"noopener\">&#8230;\/image\/<span style=\"color: #bb0000;\">gplus<\/span>\/w_150,h_150,c_scale\/106189723444098348646.jpg<\/a><\/strong><\/div>\n<div><\/div>\n<div><img loading=\"lazy\" decoding=\"async\" style=\"margin-left: auto; margin-right: auto;\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/gplus\/w_150,h_150,c_scale\/106189723444098348646.jpg\" alt=\"Google+ profile picture\" width=\"150\" height=\"150\" \/><\/div>\n<div>The following .Net code generates the same image:<\/div>\n<pre>cloudinary.Api.UrlImgUp.Action(\"gplus\").Transform(\n\u00a0 new Transformation().Width(150).Height(150).Crop(\"scale\")).\n\u00a0 \u00a0 BuildImageTag(\"106189723444098348646.jpg\");\n<\/pre>\n<div>You can apply any Cloudinary image\u00a0transformation on the image. The following example generate a 150&#215;150 face-detection based circular thumbnail while increasing the fill light of the resulting image and changing its colors to be more blueish.<\/div>\n<div><\/div>\n<div>When generating rounded corners or circular images, you might want the background of the image to be transparent. This will allow you to place the image over a <a href=\"https:\/\/cloudinary.com\/background-remover\">background image<\/a> or pattern. To do that, just tell Cloudinary to convert the image format on-the-fly to the PNG format that supports transparent background (alpha channel).<\/div>\n<div><\/div>\n<div><strong><a href=\"https:\/\/res.cloudinary.com\/demo\/image\/gplus\/w_150,h_150,c_fill,g_face,r_max,e_fill_light:30\/e_blue:50\/106189723444098348646.png\" target=\"_blank\" rel=\"noopener\">&#8230;\/image\/gplus\/w_150,h_150,c_fill,g_face,r_max,e_fill_light:30\/e_blue:50\/106189723444098348646.<span style=\"color: #bb0000;\">png<\/span><\/a><\/strong><\/div>\n<div><\/div>\n<div style=\"text-align: center;\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/res.cloudinary.com\/demo\/image\/gplus\/w_150,h_150,c_fill,g_face,r_max,e_fill_light:30\/e_blue:50\/106189723444098348646.png\" alt=\"Google+ manipulated profile picture as PNG\" width=\"150\" height=\"150\" \/><\/div>\n<div><\/div>\n<div>The following Django code generates the same result:<\/div>\n<pre>cloudinary.CloudinaryImage(\"106189723444098348646.png\").image(\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0transformation = [\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0{ \"width\": 150, \"height\": 150, \"crop\": \"fill\",\u00a0\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \"gravity\": \"face\", \"radius\": \"max\", \"effect\": \"fill_light:30\" },\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0{ \"effect\": \"blue:50\" }\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0]\n\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 )\n<\/pre>\n<div>In addition to user profile pictures, Google+ (as well as Facebook) also maintains profile pictures of companies, products and figures. You can use the same &#8216;<span style=\"color: #bb0000;\"><strong>gplus<\/strong><\/span>&#8216; image type to transform and deliver pictures of these additional Google+ pages as well. The following example delivers the picture of Google&#8217;s Google+ page while scaling it to 100 pixels width, rotating by 30 degrees and applying a grayscale effect. This time, using the <strong>name of this page<\/strong> &#8216;+google&#8217;.<\/div>\n<div><\/div>\n<div style=\"text-align: center;\"><strong>&#8230;\/demo\/image\/gplus\/w_100,e_grayscale\/a_30\/%2Bgoogle.jpg<\/strong><\/div>\n<div><\/div>\n<div>While all code samples above rendered an HTML image tag on the server-side, you can use Cloudinary&#8217;s jQuery plugin to dynamically embed social profile pictures from your client-side code on the browser side. Here&#8217;s a jQuery example:<\/div>\n<pre>$.cloudinary.image(\"+google.jpg\",\u00a0\n\u00a0 { transformation: { width: 100, crop: 'scale', effect: 'grayscale' }, angle: 30 })\n<\/pre>\n<h3>Summary<\/h3>\n<div>Many of Cloudinary&#8217;s customers already use Cloudinary to fetch,\u00a0transform and deliver Facebook and Twitter profile pictures in their web and mobile sites and apps. Now you have the same simple integration available for both Google+ and Instagram. We hope you enjoy using these new features as well.<\/div>\n<div><\/div>\n<div>Profile picture delivery of all supported social networks is included in any of our plans. <a href=\"https:\/\/cloudinary.com\/users\/register\/free\" target=\"_blank\" rel=\"noopener\">Try it out now<\/a>.<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Updates since publication: Following Google&#8217;s shutdown of its legacy Google+ API in March 2019, the Google+ (gplus) option is no longer available. Following changes made by Instagram in June 2020, the Instagram (instagram_name) option is no longer available. Many modern web and mobile applications include integral social aspects as parts of their online solution. Users [&hellip;]<\/p>\n","protected":false},"author":41,"featured_media":23343,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_cloudinary_featured_overwrite":false,"footnotes":""},"categories":[1],"tags":[91,92,165,183,214,229,257],"class_list":["post-21204","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorized","tag-django","tag-dotnet","tag-image-transformation","tag-jquery","tag-node","tag-php","tag-ruby-on-rails"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v25.6 (Yoast SEO v26.9) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Embed Instagram, Google+ profile pictures in your site<\/title>\n<meta name=\"description\" content=\"How to retrieve Instagram or Google+ profile pictures of users, dynamically adapt them to your site&#039;s look and feel, and embed them on your site or mobile app.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Display Instagram and Google+ profile pictures in your website and mobile app\" \/>\n<meta property=\"og:description\" content=\"How to retrieve Instagram or Google+ profile pictures of users, dynamically adapt them to your site&#039;s look and feel, and embed them on your site or mobile app.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app\" \/>\n<meta property=\"og:site_name\" content=\"Cloudinary Blog\" \/>\n<meta property=\"article:published_time\" content=\"2020-08-05T15:13:56+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-05-04T21:41:46+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/v1647045696\/30_IG_Google_profile_pictures\/30_IG_Google_profile_pictures-jpg?_i=AA\" \/>\n\t<meta property=\"og:image:width\" content=\"2000\" \/>\n\t<meta property=\"og:image:height\" content=\"1100\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"NewsArticle\",\"@id\":\"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app#article\",\"isPartOf\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app\"},\"author\":{\"name\":\"\",\"@id\":\"\"},\"headline\":\"Display Instagram and Google+ profile pictures in your website and mobile app\",\"datePublished\":\"2020-08-05T15:13:56+00:00\",\"dateModified\":\"2025-05-04T21:41:46+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app\"},\"wordCount\":950,\"publisher\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app#primaryimage\"},\"thumbnailUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1647045696\/30_IG_Google_profile_pictures\/30_IG_Google_profile_pictures.jpg?_i=AA\",\"keywords\":[\"Django\",\"DotNet\",\"Image Transformation\",\"jQuery\",\"Node\",\"PHP\",\"Ruby on Rails\"],\"inLanguage\":\"en-US\",\"copyrightYear\":\"2020\",\"copyrightHolder\":{\"@id\":\"https:\/\/cloudinary.com\/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app\",\"url\":\"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app\",\"name\":\"Embed Instagram, Google+ profile pictures in your site\",\"isPartOf\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app#primaryimage\"},\"image\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app#primaryimage\"},\"thumbnailUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1647045696\/30_IG_Google_profile_pictures\/30_IG_Google_profile_pictures.jpg?_i=AA\",\"datePublished\":\"2020-08-05T15:13:56+00:00\",\"dateModified\":\"2025-05-04T21:41:46+00:00\",\"description\":\"How to retrieve Instagram or Google+ profile pictures of users, dynamically adapt them to your site's look and feel, and embed them on your site or mobile app.\",\"breadcrumb\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app#primaryimage\",\"url\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1647045696\/30_IG_Google_profile_pictures\/30_IG_Google_profile_pictures.jpg?_i=AA\",\"contentUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1647045696\/30_IG_Google_profile_pictures\/30_IG_Google_profile_pictures.jpg?_i=AA\",\"width\":2000,\"height\":1100},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/cloudinary.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Display Instagram and Google+ profile pictures in your website and mobile app\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/cloudinary.com\/blog\/#website\",\"url\":\"https:\/\/cloudinary.com\/blog\/\",\"name\":\"Cloudinary Blog\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/cloudinary.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/cloudinary.com\/blog\/#organization\",\"name\":\"Cloudinary Blog\",\"url\":\"https:\/\/cloudinary.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/cloudinary.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649718331\/Web_Assets\/blog\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877.png?_i=AA\",\"contentUrl\":\"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649718331\/Web_Assets\/blog\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877.png?_i=AA\",\"width\":312,\"height\":60,\"caption\":\"Cloudinary Blog\"},\"image\":{\"@id\":\"https:\/\/cloudinary.com\/blog\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Embed Instagram, Google+ profile pictures in your site","description":"How to retrieve Instagram or Google+ profile pictures of users, dynamically adapt them to your site's look and feel, and embed them on your site or mobile app.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app","og_locale":"en_US","og_type":"article","og_title":"Display Instagram and Google+ profile pictures in your website and mobile app","og_description":"How to retrieve Instagram or Google+ profile pictures of users, dynamically adapt them to your site's look and feel, and embed them on your site or mobile app.","og_url":"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app","og_site_name":"Cloudinary Blog","article_published_time":"2020-08-05T15:13:56+00:00","article_modified_time":"2025-05-04T21:41:46+00:00","og_image":[{"width":2000,"height":1100,"url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/v1647045696\/30_IG_Google_profile_pictures\/30_IG_Google_profile_pictures-jpg?_i=AA","type":"image\/jpeg"}],"twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"NewsArticle","@id":"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app#article","isPartOf":{"@id":"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app"},"author":{"name":"","@id":""},"headline":"Display Instagram and Google+ profile pictures in your website and mobile app","datePublished":"2020-08-05T15:13:56+00:00","dateModified":"2025-05-04T21:41:46+00:00","mainEntityOfPage":{"@id":"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app"},"wordCount":950,"publisher":{"@id":"https:\/\/cloudinary.com\/blog\/#organization"},"image":{"@id":"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app#primaryimage"},"thumbnailUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1647045696\/30_IG_Google_profile_pictures\/30_IG_Google_profile_pictures.jpg?_i=AA","keywords":["Django","DotNet","Image Transformation","jQuery","Node","PHP","Ruby on Rails"],"inLanguage":"en-US","copyrightYear":"2020","copyrightHolder":{"@id":"https:\/\/cloudinary.com\/#organization"}},{"@type":"WebPage","@id":"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app","url":"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app","name":"Embed Instagram, Google+ profile pictures in your site","isPartOf":{"@id":"https:\/\/cloudinary.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app#primaryimage"},"image":{"@id":"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app#primaryimage"},"thumbnailUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1647045696\/30_IG_Google_profile_pictures\/30_IG_Google_profile_pictures.jpg?_i=AA","datePublished":"2020-08-05T15:13:56+00:00","dateModified":"2025-05-04T21:41:46+00:00","description":"How to retrieve Instagram or Google+ profile pictures of users, dynamically adapt them to your site's look and feel, and embed them on your site or mobile app.","breadcrumb":{"@id":"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app#primaryimage","url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1647045696\/30_IG_Google_profile_pictures\/30_IG_Google_profile_pictures.jpg?_i=AA","contentUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1647045696\/30_IG_Google_profile_pictures\/30_IG_Google_profile_pictures.jpg?_i=AA","width":2000,"height":1100},{"@type":"BreadcrumbList","@id":"https:\/\/cloudinary.com\/blog\/display_instagram_and_google_profile_pictures_in_your_website_and_mobile_app#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/cloudinary.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Display Instagram and Google+ profile pictures in your website and mobile app"}]},{"@type":"WebSite","@id":"https:\/\/cloudinary.com\/blog\/#website","url":"https:\/\/cloudinary.com\/blog\/","name":"Cloudinary Blog","description":"","publisher":{"@id":"https:\/\/cloudinary.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/cloudinary.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/cloudinary.com\/blog\/#organization","name":"Cloudinary Blog","url":"https:\/\/cloudinary.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/cloudinary.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649718331\/Web_Assets\/blog\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877.png?_i=AA","contentUrl":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1649718331\/Web_Assets\/blog\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877\/cloudinary_logo_for_white_bg_1937437aa7_19374666c7_193742f877.png?_i=AA","width":312,"height":60,"caption":"Cloudinary Blog"},"image":{"@id":"https:\/\/cloudinary.com\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":""}]}},"jetpack_featured_media_url":"https:\/\/res.cloudinary.com\/cloudinary-marketing\/images\/f_auto,q_auto\/v1647045696\/30_IG_Google_profile_pictures\/30_IG_Google_profile_pictures.jpg?_i=AA","_links":{"self":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts\/21204","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/users\/41"}],"replies":[{"embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/comments?post=21204"}],"version-history":[{"count":4,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts\/21204\/revisions"}],"predecessor-version":[{"id":37577,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/posts\/21204\/revisions\/37577"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/media\/23343"}],"wp:attachment":[{"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/media?parent=21204"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/categories?post=21204"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/cloudinary.com\/blog\/wp-json\/wp\/v2\/tags?post=21204"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}