Tuesday, June 6, 2017

How To Get An Approved Facebook App ID & Secret Key 2017

Facebbok Appid and secret key for WordPress and Blogger


Facebook has always been the preferred mode to connect with peoples on the internet. It does not allow only to chat with friends but also allows to developers to connect their blog and website between their applications.

One of the most branding tips you will find for you site is to create a Facebook fan page. Because, it provides several integrations like comment box plugin, like & share button, Messenger (also available for the website as a contact form), log in with Facebook form, and my favorite 'Open Graph Meta Tags' which is very crucial in Search Engine Optimization.

Facebook App ID key which is the unique numerical identifier helps to determine not only the source of traffic and app usage in Insights, but also track which ad has been most effective in getting your audience to your Facebook app (very helpful, if you are an internet marketer) because these application uses Facebook API and function to get authenticated.

The below step by step guide will help you to create a unique and approved Facebook app id (or secret key) for a page you administrate. By this guide, you can create multiple app ids for another apps and blogs.

1. First of all, go to http://developers.facebook.com/apps

1. If you are making your first app, then FB will ask you to register as a developer by your phone number verification. It's free.

2. You need to switch to your personal profile before you can access the apps you admin developer apps section.



2. Now, after being a facebook app developer. On your Dashboard, click on 'Add a new app'. see below image

App-ID and api secret key for blogger and website
3. Now, a pop-up window box will appear asking you to enter app name, contact email, category. In the category option, just select 'App For Pages'. and after that, click on 'Create App ID'. see below image

App-Id for Facebook Open graph protocol blogger wordpress
4. Then again a pop-up window box will appear asking you to enter Captcha to verify whether you are a being human or a robot. Then do it as usual. see below picture

App-ID and secret key to get facebbok comments, meta tag plugin
5. Now, you have successfuly created your first Facebook App-ID. Just click on Dashboard (located at the left hand side menu). And, you can copy the App ID and Secret key to use on your app or meta tag of your website. see below image,

copy and paste the meta tag api key to your blogger website below head tag

How To Add Facebook Open Graph Meta Tag To Your Blogger or Website

If you want to add Facebook open graph protocol or meta tag to your blogger(only), then add the below code just below the opening head tag of your blogger template,

<!-- Facebook open graph protocol start -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta expr:content='data:blog.pageName' property='og:title'/>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<meta content='article' property='og:type'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/>
<b:else/>
<meta content='jpg' property='og:image'/>
</b:if>
<b:if cond='data:blog.metaDescription != &quot;&quot;'>
<meta expr:content='data:blog.metaDescription' name='og:description'/>
</b:if>
<meta content='App-ID' property='fb:app_id'/>
<meta content='https://www.facebook.com/admin-url' property='fb:admins'/>
<meta content='https://www.facebook.com/page-url' property='article:publisher'/>
<meta content='https://www.facebook.com/admin-url' property='article:author'/>
<!-- Facebook open graph protocol ended -->

Customization

1. Replace App-ID with your new created app id.
2. Replace admin-url with yor facebook profile URL(personal).
3. Replace page-url with your facebook fan page URL.

Facebook app id becomes very necessary when we need to configure our several WordPress plugin like 'jetpack'. If you don not integrate app-id with your plugins then your plugin will show you several errors.

Thanks for reading my tutorial. Just appreciate it by sharing it in your social networks.

Thursday, June 1, 2017

Howto Embed a Part of YouTube Video with Start-End Time


Vlogging is one of the crucial part of blogging, considered one of the best tool for expressing ideas. YouTube, Dailymotion is one of the two most popular video sharing site which contains millions of videos that you can share on your blog or website.

Sometimes, you might embed a long video on your site, and also add a note just below the video to tell the visitors to watch only a certain portion. This behavior not only kills time but also irritates the viewers of your video. So it is not a good sense.

How To Embed a Specific Part of YouTube Video on Blogger
The best idea to embed a YouTube video is to take the advantages of the parameter that lets you specify the start and end time. By which you can skip the unnecessary part or the introduction part of a lengthy video as per your desire.


For example, You are embedding a full-length movie from YouTube and want that viewer to focus on a particular scene that begins from 'xx: xx' seconds and ends with 'yy: yy' seconds. So, that when the scene has finished, the video should stop playing. see demo below



Link to a certain portion(time) of a YouTube Video?

1. First of all, navigate to YouTube and find a video which you like to embed and grab the iframe code and paste the code into the Notepad. You iframe code should be something like below,

<iframe width="560" height="315" src="https://www.youtube.com/embed/-ZWGpOSS6T0" frameborder="0" allowfullscreen></iframe>
2. And now, we have to add start and end parameter at the end of the src(URL) of the video that is ?start=xx&end=yy&version=3 

3. Let's say, you want to embed a video which should start from 2:10 and ends to 2:25. So, we need to first convert our start and end time into second. Then the calculation should be,

Start Time (XX) ( 2 × 60 ) + 10 = 130
End Time (YY) ( 2 × 60 ) + 25 = 145

4. And, now the final code after adding start and end parameter should be something like below,

<iframe width="560" height="315" src="https://www.youtube.com/embed/-ZWGpOSS6T0?start=130&end=144&version=3" frameborder="0" allowfullscreen></iframe>
5. That's it. If you are not familiar with coding then this way may be complicated for you. So don't worry, we have created a generator by which you easily cut the video without any coding knowledge.


Cut video using Generator (Easiest way)

Howto Embed a Part of YouTube Video with Start-End Time
If you are still facing problem or you do not want to manually edit the parameter of youtube URL then try our offline generator which is built with JavaScript. You need to subscribe to our email list to download this generator. App will be delivered to your verified email address.