Free CORS Proxy List To Use With JavaScript

Whenever if you have tried to use some API or tried to get some information from the GET reuest via JavaScript XMLHttp Request or fetch(), you must have encountered the error similar that of below.

You can use free CORS proxy servers to bypass same-origin policy related to performing standard AJAX requests to 3rd party services. Usually it is not recommended to use these proxies in production mode, simply because you might have no control over it. But you can set up your own proxy server and use it.

These free CORS proxy server list here is made to use their API for development mode.

You can use to prevent mixed content of images and JSON data proxying the resources to serve them under https.

1. Codetabs CORS Proxy

API URL => "https://api.codetabs.com/v1/proxy?quest=<url_to_http_resource>"

- Each request is limited to 5mb size download to avoid abuse.

- Only supports GET request.

- Limit : 5 request per second. Once reached subsequent requests will result in error 429 (too many requests) until your quota is cleared.

2. origin.maskoding.com

API URL => https://origin.maskoding.com/?url=<url_to_http_resource>

- Only supports GET request.

3. All Origins

API URL => https://api.allorigins.win/get?url=<url_to_http_resource>

Example With JavaScript Fetch =>

fetch(`https://api.allorigins.win/get?url=${encodeURIComponent('https://wikipedia.org')}`)

                    .then(response => {

                      if (response.ok) return response.json()

                      throw new Error('Network response was not ok.')

                    })

                    .then(data => console.log(data.contents));

Example

Now suppose I need to get a contents of a page on Wikipedia to show a user on my web page, I can call fetch() to that particular URL via JavaScript. But the request won't get completed because of CORS or Cross-origin Resource Sharing.

For which you need to fetch() the webpage data from your server and then show it to user.

Now fortunately, we have these free APIs so that we don't actually need to set up a server to make all request with them.

SO above were the list. If you know any more proxy sites, do enter the links in the comment section so that others would also get to know about them. 😊

How to remove photos from a website without changing HTML code only using CSS?

Yes, you can do it using CSS only, however JS would be a great option. There are many ways to do this using CSS, so lets dive in ;)

Before Proceeding, this is a short notice that the image element will be there in HTML - but only styles will make them disappear from the screen view.

Top 10 FREE Websites For Image Hosting

You want to add images to you website or blog or forum? Suppose you are running out of storage space which has been provided to you by your hosting provider.

How To Add Hyperlinks In Blogger's Comment Section ?

Blogger's comment box is one of the best place to spam. Although you can turn on custom moderation for your comments spam is still there. I too keep getting Sammy comments all the time, but I keep Ignoring them.

Google turned down support for their URL Shortener, Here are the top 7 Alternatives

As of March 30, 2018, Google announced on their developer's blog that they are looking forward towards bright future and moved towards Fire Base, leaving behind the support for their URL shortener, Goo.gl.

Shortening the URLs is much of fun as they were giving you a track on traffic coming from different social media and apart from that, they were easy to share.

Hence, compressing large URLs into a small, we can't sit back and now need to find some other alternatives to URL shorteners. So, here, I've collected the top 10 alternatives for URL shorteners.

• Read Also:-How To Track The Analysis Of Goo.gl URL's Or From Google's URL Shortener?

1.Bit.ly
Bit.ly is very good for Information Tracking.They are much powerful to deliver high engagement and real time insights. Bitly offers you to shorten, brand, track, and share links from its secure and intuitive platform.Account limits you for making 500 branded links and 10,000 non-branded links.

Enterprise account (paid service) can give you much more links as you want and you can analyze the information more accurately and get richer analysis than the free account.Over 3 hundred billion links are shortened by bit.ly (and counting).

2.Ow.ly
Ow.ly is User friendly.Ow.ly has a very user-friendly dashboard for shortening links and to track them.In order to create short links, you need to sign in to a Hoot-suite dashboard.The free version of Hoot-suite gives you unlimited access to the Owly link shortener. You can also upgrade to a paid plan if you need more features.

3.TinyURL
Tiny URL is best for anonymous use. TinyURL is very simple and best for anonymous use somewhat like Google URL shortener.Once created a link by TinyURL, it didn't break in email postings or expires.

Just head over to their sire, enter your link to be shortened, add your custom alias if you want (this makes TinyURL better than Google URL Shortener.) and hit enter!

One down-point I found is that, if your custom aliases is not available, you need to add the URL and need to do the whole process again. TinyURL is good for simple URLs, but not for professional use.

4.Ouo.io
To make a little bucks out of your links.
Ouo.io can be used not only to shorten your links but also to make some cash.You can make nearly or more than $8 from 1000 clicks no matter from same or different IP or user.This makes this URL shortener a very simple and easy to use.At the date of writing this post, Ouo.io not uses https:// which may disappoint some people. Although, they can update it.

Minimum payout in Ouo.io is 5$ and paid 1st and 15th day of the month.

There are many short-links sites like these which pays you through the means of advertising.When user will click on your short link, these site takes them to a page where there is an advertisement.After some time, they redirect the user to their original page.would suggest you not to go through this method, as the ads on the platform may be spamery, which may make the user disappointing and annoying cause to leave your site.It could also take down your reputation.

5.Buffer.com
Buffer is good at managing social media links.It is another short linking site which is free as well as paid.In the paid account, of course, you will get a lot more benefits.It has business plans to $399.

Buffer is simplest and most powerful social media tool, and to set the bar for great customer support.You can give it a try in its free plan first before upgrading in pro plan.

6.Cutt.us
Simplest URL shortener.Cutt Us is very simple to use.Just head over to cutt.us, paste a long URL, you can also add custom alias if you want and hit enter! You have a short link and Qr code ready.Must try!

7.V.ht
Really very hot!If you don't prefer cutt.us, then v.ht is best smart service for you.It is simple, easy to use, and fast.

I have tried to provide the best names of URL shortener with a varying need of different users.If you know more URL shorteners than these, you can comment down below.
Read more articles about blogging in the blogging section of this blog above and give a like to CSS-magz on Facebook.

Set any thumbnail for the blogger blog post

While comparing WordPress and Blogger, the one down-point of Blogger is that there is no feature to set or choose any picture that you want as thumbnail of the post.Today, we are going to see how we can choose the random picture as thumbnail for the blog post.

To do this, first we need to understand that to which picture the Blogger makes as its first photo!It has been noticed that Google Blogger always takes the first picture in the article as its thumbnail.

So, the solution is to make a beautiful thumbnail and always add it as the first thumbnail of the post.

But, what if you don't want to put it as the first image?For that, there is a little hack!Let me show you that.

• First, after writing the whole post, add  the thumbnail image at the top of the post like in the below image.
  

After adding thumbnail at the top of the post, it will look something like this.

Now, Switch to HTML tab from compose tab as shown below.

After that, you'll find the <img> tag.If you know HTML, you will understand this better.

Now, we need to hide the image using attribute style='display:none'.So, add it after '<img '.Then it will look something like this.

BOOM!That's it! Now publish the post and you will notice that the

 thumbnail is Not visible in the post but is visible in the Home where all the articles are being shown,You will also com to know that while sharing the links on social media, such as Facebook, thumbnail is being shown.

If you preview this, then it will won't work.This trick will work only after publishing the article.This will not work if you did any mistake in between.There should be space left in front and back of the 'style='display:none''.If you have any problem, comment down below.I'l surely reply.

If you want demo, then check in this article itself.You won't find any thumbnail included in this post, but when you look it from the home, then it will appear.

Thanks for reading this post.If you liked it then give a like us on Facebook.

Increase you Facebook page likes

Making a Facebook page is a very easy task, but gaining likes becomes difficult sometimes.So here we come up with some extreme tips that will help you in getting more Facebook page likes.

1.Make all the things set up
After creating a Facebook page, follow the tips give Facebook,i.e. Set up a profile , cover and then set a unique id for the page.Unique Id should be short, rememberable this redirects your page like https://wwwfacebook.com/your_id,. The reason behind it is-; Let me explain with an example.If you search Css-magz on google, the first result comes up is on our Facebook page then you'll see on somewhat 3rd or 4th link that this site is there.So, having social media accounts similar to the website name is better.
Another advantage is, the search engine will see your page as a little well known as it will see your likes on Facebook page.Make sure you've added your site's URL in your facebook page's about section.

The best way to target the right audience on your page is by promoting your Facebook page.You can promote any of the Facebook posts on your page, in minimum $1.It will bring true followers as Facebook targets their ads to the people of the specific interest.

Other ways are Quora and Facebook groups.These ways remain common as I have discussed that in this article.But, here I'm going to add some more Facebook groups.

2.Make Magical posts
Make some good posts like quote posts.You can easily make them very beautiful using Canva.
You can also make some other, such as did you know or comic post like below.You can take help of the tools like Meet Edgar to maximise your reach.

• Also Read-Making use of Canva for awesome post Thumbnails.

3.Add Facebook widgets to your blog or site
You might have noticed that when you leave a site, a popup comes like below and tells you to like their Facebook page.These are Facebook widgets.You can make then very simply here.These are plugins also called as Social plugins which helps you to maximize your reach to the people of you blog.

First add your page URL like-'https://www.facebook.com/cssmagz'.Enter in tabs what you want to show.For e.g. timeline, message, events etc. You can also specify the width and height and then click on the 'Get Code'.Then you will get a code.You can embed it either through FB JavaScript SDK or an iFrame.

3.Invite your friends to like
You can, of course, invite your own friends to like your Facebook page.It is very easy way to get likes very early when you start your page.

4.Make two pages
This trick can also be used when you are unable to get expected likes.Make another page of nearly similar topic.For e.g. I have a brand page-'Tony Bakes' then another page will be-'Cake Lovers'.

Cross post across two pages to increase their likes.Try to touch the emotional feelings of the people towards their passion to get more likes.

Also, you can submit your posts to another page with lots of likes.Or can tell them to share your one of the post so that the people will also reach your page.

5.Share your Facebook page
There are many groups on Facebook a we've discussed here where users will exchange their Facebook page links and like each others posts.Join these groups and start sharing.

↦💞In Veronica’s Corner: Social Media Share Group 💞
↦Share Your Blog + Tips and Tricks
↦The Bogging Crew
↦Blog Booster

6.Try to use the following words in your Facebook page post.
To maximize your post reach, you expect to share it by your followers.So remember to use the following words next time-

Warns,Inspires,Unites,Amuses,Gives,Offers,Discount,Deals,Amazes,Advises.

It also seems that Facebook helps these posts to get maximum reach.

7.Post things at right times.

Avoid posting anytime .Its better to make a schedule.The best time to post are 12 PM, 3 PM and 7 PM. Although, this cannot be accurate for all the people because of different demographic and industrial factors.

So this were some tips and tricks to increase your Facebook page likes.Hope at lease one will sure work for you. Thanks for reading the post and to be connected, leave a like to css-magz's Facebook page for sure.

Build a HTML 5 Video Player With Custom Controls || Part-2

This is the second part of  ''How to make an HTML 5 video player with custom controls''. For first part head over to the first post.

10 Tips to Speed Up Your Blog's Loading Speed

Maintaining higher blog speed is also a factor in SEO. We constantly need to check if our blog is running at uniform speed or not and for that we need to apply some techniques to make it faster.

Today we are going to look at some easy to do techniques to boost up page loading time.

• Take Look At Host

The very important thing if you have any blog, website or web app.It is okay if your bog is hosted on blogger.com as it runs on Google servers which are usually fast.

But if you are using any third party hosts, and your page loading speed isn't that great, then you need to upgrade your plans.If you are using shared hosting then upgrade it to VPS.

• minify CSS and JavaScript

If your scripts are not minified(compressed), then do it as it will surely increase your page load speed. Minifying or compressing this scripts will reduce the size of the files and thus, they will load faster.

If you use WordPress, you can use this or any other plugin.For non-WordPress users or bloggers, you can use some online tools like this.

• Compress images

This is the most important factor responsible for slow page loading speed. Many bloggers use high -quality images(nothing harm in them) and their size is also high so it takes much time in loading.

You need to compress this images as they will reduce image size and there is no much need of using high-quality 1080x1768 px images if finally, they will be loading at 590x590px. Also at mobile phone level, there is no much need of using this high-quality images.

When the page is being loaded, the browser tends to load the text in the page first.If you have already specified height and width of the image in <img> tag, the browser will leave that space and will load the text first and then it will load the images.

For compressing images, you can use WordPress plugins such as smush or many online tools are also available like this.

If you are using Google blogger, the Blogger will automatically resize the image and will add height width.

• Use CDN

Using content delivery network or CDN page will absolutely load faster as it would load resources from the nearest server to user. YouTube also uses CDN to deliver the video much faster to the user and cuts off much streaming time.There are many CDN available such as CloudFlare. It has 150+ data centers around world.

• Use a better theme

Use an SEO friendly, fast loading theme.If theme itself takes much time in loading, you need to change it immediately.

Choose a theme from well-trusted sources. It is better not to go much far for free themes in case of WordPress or similar as they can further create problems if there are any malicious code in it.In Blogger,theme  is made of simple xml yet you need to download from trusted sources.

• Don't load unnecessarily

Check whether some resources are loading unnecessary such as unnecessary scrips etc. If they are, better to remove them.

• Delete unnecessary plugins

If you find that a plugin is no longer useful to you, do delete it. Check for a plugin that would do the work of two or more different plugins(plugins substitute).

• Show limited number of posts

Anytime if a user searched anything to set a limit of 10 results or like that.Loading posts way more will increase loading time.So load a limited number of posts or even comments.

• Use JavaScript at end

When inserting JavaScript to the page, such as Facebook or any other sites, add it after <body> tag.SO it will not interrupt the existing things while loading.

• Don't use too many Advertisements

We've seen many bloggers using too many ads from different ad publishers.Load all the ads after loading the page.Many times, in slower connections before loading the text and images, the ads start bonking up.This is because they have inserted the scripts at top of the page.These scripts take time to load and further the whole page loads slowly.

Well, Google seems to consider 0.5-1 sec as excellent page loading time. However,less than 3 sec are average for most of the websites.

Use the above tips to make your blog faster and move a rank up in Google search!