All of you know about Facebook’s post preview process. Just paste any URL in text box and its fetch meta content and image data. In this tutorial we will show you how to extract URL data with PHP and jQuery.
In this example we are using PHP Simple HTML DOM Parser to extract the HTML elements from any URL. This is free library code file, which easily available at https://sourceforge.net/projects/simplehtmldom.
This PHP Simple HTML DOM Parser support for PHP 5+ version. So make sure that you have compatible version to execute this code.
Extract URL Data Like Facebook Using PHP
Lets start with the Index page. In this we created an textarea field, in which you can paste any URL and results will be show in DIV element via ID.
When user type any URL, an jQuery code is called. Which will use regular expression to extract URL and make POST Ajax request to process.php file. An JSON format data will be return, which contain page content and image urls.
In this index page clean thumbnail navigation script also defined. User can select image thumbnail using with Next or Previous icon. So if URL contain more than one image, you can easily select from it.
Note* : Must include ‘jquery-1.9.0.min.js’ in index.html file.
Check it out below Index.html code.
PHP Request to Extract Title and Meta From URL
Now create process.php file to handle Ajax Post request. This file include PHP HTML DOM parser (requires PHP 5 +), which parse the HTML element and return JSON response.
You can manipulate the returned json data to show required result in preview section.
This tutorial explained the process to extract the content from URL and show it in Preview form as Facebook, Twitter and LinkedIn sites doing.
Hope this will help you to achieve similar kind of requirement. Good Luck.