Sunday, May 14, 2017

Top 5 Icon Fonts (via CDN) for websites

  6:58 PM            1 comment
On the web we will be seeing different kinds of icons on many websites but many think those icons were designed and kept as images but it is not true, those are just imported from different online libraries. You just need to add the particular class or custom tag provided by the icon pack to view those icons. Today I am going to provide the top 5 icon packs to use on the online. These packs can be used on blogger, wordpress, joomla or in your custom HTML pages.

Installation Process

  1. Choose your icon pack provider
  2. Download the pack or use the CDN link
  3. If you are working in HTML paste the CDN HTML code inside the <head> tag.
  4. Depending on the icon pack choose the desired icon and use the provided syntax to add the icon in your page.

1.Bootstrap Icons

CDN HTML Code:
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

Syntax:

<span class="glyphicon glyphicon-icon_name"></span>
OR 
<i class="glyphicon glyphicon-icon_name"></i>
All the icons and its names can be found here.
Check examples here.

Example:
See the Pen Bootstrap Icons Example by Harikesh (@harikesh409) on CodePen.


2. Font Awesome

CDN HTML Code:

   <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

 Syntax:

<span class="fa fa-icon_name"></span>
OR 
<i class="fa fa-icon_name" aria-hidden="true"></i> 

All the icons and its names can be found here.
Check examples here.

Example:
See the Pen Font Aweswome Icons Example by Harikesh (@harikesh409) on CodePen.

3. Foundation Icons


CDN HTML Code:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/foundicons/3.0.0/foundation-icons.css" />

Syntax: 

<span class="fi-icon_name"></span>
OR 
<i class="fi-icon_name"></i>
All the icons and its names can be found here.
Check examples here.

Example:
See the Pen Foundation Icons Example by Harikesh (@harikesh409) on CodePen.

4. Ionicons


CDN HTML Code:

<link rel="stylesheet" href="http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" />

Syntax: 

<span class="icon ion-icon_name"></span>
OR 
 <i class="icon ion-icon_name"></i>
All the icons and its names can be found here.

Example:
See the Pen Ion Icons Example by Harikesh (@harikesh409) on CodePen.

5.Themify

CDN HTML Code:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/themify-icons/0.1.2/css/themify-icons.css" />

Syntax:
<span class="ti-icon_name"></span>
OR 
<i class="ti-icon_name"></i>
All the icons and its names can be found here.

Example:
See the Pen Themify Icons Example by Harikesh (@harikesh409) on CodePen.

Sunday, November 17, 2013

How to Embed Social Media posts to your blog or website

  5:23 PM            No comments
How to Embed Social Media posts to your blog or website
Social media sites offers various features including Embed feature for users to connect with peoples from across the World. With this feature users can add their social media posts including pictures, videos, hashtags and other content directly to their blog and website. Embed posts can be seen by anyone even if they not having such social media account.

How To Embed Tweets:

To embed your Twitter tweets to you blog please follow the below steps
  • Sign in to your Twitter account 
  • Click on the down arrow button of a specific post, which you want to add to your blog post.
    • Embed Tweets

    • Then click Embed Tweet button in drop down menu
    • Next a pop-up window will open and show Embed code of the specific post 
    • Just copy and paste the code in your your blog post. 

    How to Embed Facebook Posts:How to Embed Facebook Posts

    • To Embed Facebook post to your blog, first check the post should be shared public. You can know that by hovering your mouse cursor over the audience selector (you'll see a globe icon).
    • Then click the Menu  icon in the top right of the specific post and select Embed Post in drop down menu
    How to Embed Facebook Posts
    • Now the dialogue box shows the two lines of HTML code, just copy the code and paste it to your blog.

    How to Embed Google+ Posts:

    • Sign in to your Google+ account
    • Click on the menu icon of the specific post which you want to embed
    • Then choose Embed post option in drop down menu
    •  A dialog box displays with embed code that you can copy and paste into your site.
    How to Embed Google+ Posts

    How to Embed Pinterest Posts:

    • Open Pinterest.com and sign in to your account
    • Click on a specific pin which you want to Embed, then click the Menu button in top of the pin
    • Then select Embed option
      • How to Embed Pinterest Posts
    • Then copy the embed code to your blog or website. 

    Wednesday, September 25, 2013

    Are You Using Your Social Media?

      8:33 AM            No comments
    If you run a small business and you’re trying to use social media to promote yourself, remember that you have some remarkable advantages over larger businesses in this regard. Larger businesses have to navigate the tricky waters of coming up with posts that get people engaged and maintaining their brand image. For smaller businesses, the fact that you probably do business in a physical community and there is a face that people associate with your business can be real advantages. You just have to make sure you’re using it right. 

    Bad Stats 

    There were revealed some facts about social media that may apply to your business. For instance, a survey referenced in the article found that 58% of companies that were actively using Facebook didn’t feel like they were promoting it the way they should be. It is understood that most small businesses out there probably have a social media profile. Except for the time invested in making the profile, it is essentially free, at least from an upfront investment.

    The same article, however, shows that 76% of small businesses surveyed about the matter found that they got positive results from using social media. A full 78% of the people who responded about their businesses said they got 25% to 100% of their customers via social media. That should reveal the power potential in this type of promotion, if you had any doubts.

    How do you go about using it, however? Here are some creative ways that you can go about using social media to promote your business. Remember that they do require something of an investment, whether that is in terms of time or simply offering an incentive to customers who help you out.

    Incentivize

    There are various ways you can incentivize using social media. For example, if you happened to run a fitness center, you could offer a free beverage or some other incentive if people are willing to check in when they show up for a workout. This helps to get the word out about your facility, particularly to people who may be friends of some of your clients but who aren’t particularly interested in following your business. It gets your name out there and that’s important.

    You can also offer an incentive for people to like your business. This is easy enough to do. If you have regular customers, clients or a membership driven business, ask them to like you on Facebook as a way of promoting the business. They are already your customers, so some sense of loyalty may apply here, particularly if you are a small business and the person they see behind the counter when they show up is the same person who owns the business.

    Participate

    If there are community events that you can sponsor or participate in, be sure to do so and publicize it on your social media profiles. You can do this without being overly opportunistic. For example, if you had employees participating in a charity run, it would be easy enough to put out a Twitter notice about it and actually promote the event rather than directly promoting your business. Remember that your business logo will appear on the tweet, so you get the promotion, anyway.

    Make sure your domain is integrated with your social networking site.WordPress templates oftentimes have these types of features built right into them, so it’s usually just a matter of selecting a few check-boxes and settings and preferences. Once you have this done, you can further integrate your social media so that people who visit your webpage will see that they can learn more about your business on social media, where they may discover some very positive things.

    About author

    Anny Solway is a dedicated writer at ThemeFuse – a web studio that creates original WordPress themes, that can be used out of the box. She loves to share blogging and technology tips.

    Thursday, May 16, 2013

    How to Add Wikipedia Search Box to Blogger

      4:04 PM            No comments
    Wikipedia Search Box For Blogger
    Wikipedia Search Box for Blogger - Isn't it cool? In this article below, I have shared How to add Wikipedia Search Box to Blogger (BlogSpot) blog. Blogger has recently launched a new official widget to its Gadget Gallery as Wikipedia Search Box. Wikipedia Widget/Gadget allows you to insert a Wikipedia search box into your Blog. You can add this Wikipedia Search Box to your blog sidebar, header and Footer. So if you are looking for adding a Wikipedia search box to your blog, Here is a quick guide on how to add Wikipedia search to Blog.

    No doubt, Wikipedia is the second top most popular search website in the world. And it is always a good idea to add best search engine box to Blog or website. Since if your are running an informative Blog, you must add Wikipedia search box to your blog. There are many benefit of adding Wikipedia Search to your blog. This Wikipedia Search box will help your blog reader to search Wikipedia articles without leaving your blog. And this is how you can stop your blog reader on your blog for some more time, that helps you to decrease your Blog Bonus rate too. Let’s start adding Wikipedia Search box to Blogger blog.

    Wikipedia Search Box for Blogger

    So if you are ready to add Wikipedia search to your Blog. Adding Wikipedia search box to your blog/website is so easy, you just need to add a new Gadget to your Blog in the form of Wikipedia. However follow the instructions given below for adding Wikipedia Search Box to Blogger.

    Adding Wikipedia Search Box to Blogger

    As you are a Blogger user for a long time, you probably would have know How to add widget to Blogger’s blog. But if you are new to Blogger, don’t worry it’s too easy to add new widget to Blogger.
    • Simply Go to Blogger>> Your Blog>> Layout>> Add Gadget>>More Gadgets.
    • A Pop-up box will open, Now find Wikipedia search widget.See the picture below for reference.
      Wikipedia Gadget
    • Now click on this widget and give a title (optional) and hit Save button.
    • Now drag this widget where you this widget to show i.e. Sidebar, Header and Footer.
    Congratulations! You have successfully added Wikipedia Search box to your blog. Now check your blog, This Wikipedia Search box widget will looks like this.
    Demo of wikipedia search box in blogger
    Hope you like this tutorial to add Wikipedia Search to Blogger. What is your view about this new Wikipedia search box for blog. Share your view via comment box below.

    Monday, May 13, 2013

    4 Best Tools to Run Giveaways & Promotions on your Blog and Website

      8:50 PM            1 comment
    Here I listed 4 best web apps to create entry form for giveaway and online promotions, it helps to increase your blog community and social media subscribers. With these app you can easily manage your giveaway and also you can select random winners.

    1. Giveaway Tools

    Giveways Tools is one of the best web application that allows users to create embeddable entry-form to run Giveaways and Promotions on your blog. You can create and stunning giveaways with following subscription features. It is featuring auto-verification through third-party APIs.

    Giveaway Tools

    Features:

    • Blog Comments
    • Etsy - Favorite An Item
    • Etsy - Favorite A Seller
    • Facebook - Like A Page
    • FeedBurner - Email Subscription
    • Pinterest - Pin Something
    • Pinterest - Follow A Board
    • RSS Subscription
    • Twitter - Follow
    • Twitter - Tweet
    • Voting For Blog

    2. Punch Tab

    Punch Tab is an another best tool to run giveaways on your blog, websites and Facebook pages. With Punch Tab you can set 9 different ways to users for entering your giveaway. 
    Punch Tab

    Features:

    • Twitter - Follow
    • Twitter - Tweet
    • Facebook - Become fan
    • Facebook - like
    • Google+1
    • Blog Comment
    • Question
    • Visit
    • Download

    3. Rafflecopter

    Rafflecopter allows you to customize and embed an entry form on your site for promotions and giveaways. It automatically select random winners, and it allows to download all your subscription details as spreadsheet.

    Rafflecopter             

    Features: 

    • Build your email lists
    • Facebook Fan & Like
    • Twitter Follow & Tweet
    • Pinterest Follow & Pin
    • Facebook app to run giveaways on Facebook page
    • Instant Random Winners and more

    4. Wildfire App

    Wildfire one of the best web application to create giveaways and promotions. It is owned by Google and it is available only  in premium version. It allows to Run any kind of promotion, contests, sweepstakes, coupons, giveaways, and others.

    Wildfireapp

    Features:

    • Real Time analytics
    • Fast and easy
    • Social media subscription option available for Facebook, Twitter, LinkedIn, Google+, Pinterest and YouTube.
    • It allows user to create Sweepstakes, Coupons, User-Generated Photo, Essay, Video Contests, Pick your Favorites, Quizzes and Trivia

    Sunday, May 12, 2013

    How to add Save to Drive Button to Your Blogs

      1:15 PM            No comments
    Google launches new Save to Drive button that allows users to save web contents directly to Google Drive account with one click. If you are a blogger or web master? you can place the Save to Drive button into your site, that helps your site visitors to save your post image directly to their Drive account with one-click.


    How to add Save To Drive Button

    To add Save to Drive button on your website is easy. You simply have to include the script and HTML tag below 
     <script src="https://apis.google.com/js/plusone.js"></script>
    <div class="g-savetodrive"
    data-filename="My Statement.pdf"
    data-sitename="My Company Name"
    data-src="/path/to/myfile.pdf">
    </div>  
    Demo



    Click the Save button to save the above picture.

    There is also the Save to Drive button’s JavaScript API, which allows programmatic and flexible control of the creation of Save to Drive buttons in your web pages

    Google says "The Save to Drive button works in the context of the user’s browser. This allows your users to save files that could require some form of HTTP authorization – such as a session cookie – without any special customization from you. In most cases, the Save to Drive button should be simple to integrate, plug-and-play!"

    Tuesday, May 7, 2013

    5 Best Free Apps to Manage your Blogs with your Phone & Tablets

      8:59 PM            No comments

    1. Wordpress

    It is official Wordpress app for users to manage their blogs with their smartphones and tablets. It is available for all major mobile platforms such iOS, Android and more.
    • Write, edit, publish your post
    • Check your blog stats
    • Moderate your comments
    • Post images and videos and more
    Download Links
    Android
    iOS
    BlackBerry
    Windows Phone
    Symbian

    2. Blogger

    Official Blogger app allows users to quickly and easily publish posts to your blog wherever you are. With this app you can compose and publish new post, Add labels and location and more. Available for both Android and iOS devices.
    • Compose a post that you can save to draft or immediately publish
    • View list of your saved and published posts 
    • Switch account/blog if you have more than one 
    • Embed an image from the gallery, or, by taking a picture directly from the app
    • Add labels to your posts
    • Add location information
    Download Links
    Android
    iOS

    3. Tumblr

    Official Tumblr app for its users to manage blogs from anywhere and anytime with their smart devices. Tumblr app available for Android, iOS and Windows Phones. 
    • Post anything, from anywhere.
    • Share photos, gifs, video, music, quotes, chats, links, and text. Find and follow the things you love, and get all your latest news from your dashboard.
    • Bonus: Add a 'create a post' widget to your home screen.
    • Advanced controls: Save drafts, queue posts, customize tweets, and more!
    • Messages: View and reply to messages.
    • Address book: Find people to follow from your address book.
    • Multiple blogs: Seamlessly manage all of your blogs.
    Download Links

    Android
    iOS
    Windows Phone

    4. Weebly

    Weebly is an one of the most popular blogging platforms and website builder. Currently more than 15 million sites created by Weebly users.

    • Start a new blog with our powerful drag & drop creator and modern themes
    • Create new blog posts while on the go
    • Easily add text, photos and videos to your blog posts
    • Apply custom filters that make your photos stand out
    • Instantly respond to blog comments & form entries
    • Share your posts to Facebook & Twitter with one click
    • Check your site stats from anywhere
    Download Links

    Android
    iOS

    5. LiveJournal

    LiveJournal is a social network owned by SUP Media where Internet users can keep a blog, journal or diary and more. With is LiveJournal App you can read your friends page, manage your friends list, post entries to your journal and communities, upload photos, communicate with other LiveJournal users and more.
    • Read friendspage, users' and communities' journals
    • Read and write comments
    • Post entries to your journal and communities
    • Post photos
    • Create and post polls 
    • Edit your last journal entry
    • Compose and edit drafts
    • Manage your app settings for mobile posting

     Download Links
    Android
    iOS
    Windows Phone
    Symbian
    Subscribe to: Posts (Atom)