How to display a link on my page - javascript

I want to display google link like that in my page.
whenever we post a link on a Facebook page its look like as the above picture. how to do the same in my webpage .how to display the google link like that

That looks like a link shared on Facebook. The styling of a link like that doesn't happen automatically. You'll have to use html and css to format a link to look like that yourself.
Here's an example using pseudo html. You'd need to actually style this yourself to achieve the desired result. If you don't know how, some websites to start learning html / css are codecademy.com & w3schools.com
<a href="link_url">
<img src="google_logo_url" />
<div>
<h3>Google</h3>
<p>Search the world's information....</p>
</div>
</a>

Embed.ly can be useful for you. It takes a URL and generates a piece of code, which you can paste in your HTML document to get similar look to that of your picture. Below is an example of its code in usage
From this link you can access it for free: http://embed.ly/code

Related

Change a Href Link with JavaScript Wordpress Website. Where can i edit Javascript?

I have a Wordpress site and created it with Elementor. Now I would like to change a button link on a subpage that cannot be edited with Elementor. When you click the button, I want you to come to a different page than the default page.
I can probably change this with JavaScript, i.e. the link structure / shortcode of the link. But I don't know where to write it down or edit it? This is not possible with the customizer. And what does the code have to look like? I am not familiar with Javascript.
A Example:
Default Button-Link (checkout-Shortcode):
Auschecken
And i want to change it to (checkout2-Shortcode):
Auschecken
Please Help!
You can create your own js files in: "Appearance > Custom Layouts > Add New"
Name the file like custom-script.js and it will be js
You write your code how you want and below you have the part "Custom Layout Settings", you can choose the pages where you want to display it and others options.

How to get data of a website when a link is pasted of typed

Hey guys any idea on how to make something like this? where you paste or type a link and it display a little content of that website just like what facebook did using JavaScript or react js
you can use an iframe to show another website on your website

Facebook share button

I want to add Facebook share button to my site. But when I use the code given by Facebook, it doesn't show any FB logo image in button style & also doesn't count any share. Please help me figure out a better code.
Currently, I'm using:
<a href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fparse.com" target="_blank">
Share on Facebook
</a>
The easiest way to add Facebook share button would be to visit http://www.facebook.com/share_partners.php and copy the code and paste it in your webpage after replacing the text "url" with the actual URL of the page you want to share. If it is dynamic content, you can use the variable or object name.
<script>
function fbs_click(){
u=location.href;t=document.title;window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t),'sharer','toolbar=0,status=0,width=626,height=436');
return false;
}
</script>
<img src= "http://b.static.ak.fbcdn.net/images/share/facebook_share_icon.gif?8:26981" alt="" />
Take a look at the official documentation: Facebook For Developers: Share Button.
If you merely click the "Get Code" option on the Facebook Share Button Configurator & Generator, you'll see that the URL generated is rather simple:
https://www.facebook.com/sharer/sharer.php?u={yourURLhere}
At least it seems that way to me:

Jquery script like google image preview

I am looking a script (example in web) like google images preview. I have attached an image what I am looking for
I have spend a time of looking such script / example but nothing. If someone know a name or a link please give it to me.
I have found a script but it's not exactly like Google Image's but has the same functionality. The script is free and is coded in HTML with CSS and JavaScript.
Click here to view the script

Rails 3 : Turning rails views in to a javascript snipet others can copy/paste

I have a rails site where users make a custom profile. It's a picture of themselves with a link and a title sentence, sorta of like a billboard with words.
I want to take this show view from rails and create custom javascript snippet of code for each user so they could copy and paste it into their own websites and blogs and have it show up according to my rails site.
How is this done? Is there a gem?
Thanks
One option is to use fixe sized iFrame, which acts as a sort of window into another site, instead of javascript. The main benefit of using an iFrame is that its isolated from the parent page's CSS and Javascript. So, none of that pages' styles/scripts will affect the display of your code. You can simply serve up a regular HTML code in the iFrame.
The snippet would look something like:
<iframe src="http://yourdomian.com/profile/1/widget" height="100" width="50" />
a simple js script like this :
<div id="profile"></div>
<script type="javascript">
$.get('/user/101/profile', function(data){$("#profile").html(data)});
</script>
and in your /user/101/profile, use render :partial => 'profile'.

Categories

Resources