Nifty Widgets in Action

These are real, live examples of Nifty widgets in action. They're all accessed via the get code section of Step 2. There's product grids, slideshows, scrollers and a text linkifier.

To use these widgets you need somewhere you can paste the generated code. All have been tested on Blogger blogs, most work on Wix and Weebly, some on Wordpress self-hosted sites and if you have an old-school do-all-the-html-yourslef for your website domain, then all will work.

Get code for embedding in other sites

The following are examples of the widgets created by the code generator Nifty tools. You can easily get similar for your own blog!

Product Grid - pure html code pasted here









Horizontal Scroller pasted here - pure html





Vertical Scroller pasted here - pure html



With this widget, you get to set the height and whether it should float to the right or to the left, as is used for this one. All the other usual settings apply so you can fine tune it as you like.

It's really aimed at when you want to have the text flow around your vertical scroller, looking like it's a natural part of the article.

The key thing to remember is that it's widget first, then the text that's to flow round it. I've included the standard Lorem Ipsum text below so you can see the text flow in action.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Linkify Text - pure html

The following paragraphs have been linkified. As you hover on the links (or select any of them for mobile), you'll see the image of the linked product magically appear. It's a great effect that your visitors will love. For you, it gives greater flexibility for content that promotes your products. Cool :)

Try the magic image effect for yourself on the following linkified text:

I enjoy designing business cards to suit small and one-person businesses. I always try to bring something unique to a design, something that speaks the same message as the example branding on each card.
This one is for a counseling service or counselorMonogram, Counselling Services, metallic-effect Business Card, with the suggested tag line "helping you talk about what matters". The logo completely supports the message with two line-drawn heads engaging deeply.

For the auto sales trade, one specializing in luxury sports motors, I drew a stylized luxury-looking sportscarAutotrade - Red Sports Auto on flaring steel-look Business Card. This one is in red on a shiny metallic-effect background. The example tagline of "luxury sports autos for premier people" fits well with the rest of the design. I think you'll agree, it paints exactly the right picture needed for staff of a luxury sports car showroom.

One final example, again nicely unique, this oneLawyer / Attorney luxury pink chrome-effect Business Card is designed for women layers, legal counsels etc. On a rose pink background with a shiny chrome effect, the font used should inspire confidence in potential clients. Simple yet effective design but one carrying authority.

There are many, many other designs to choose from... (and a horizontal scroller could be placed here to show the most popular)

Slider widget

This is designed to be shown large, and, like the others, uses a responsive design. It's static, meaning that the products are determined when you build the widget, not pulled fresh every time someone visits the post / page. Brilliant on tablet / mobile.

No comments:

Post a Comment

Comment moderation is switched on. Please wait till I've had a chance to review your comment and publish it. Thanks!

Subscribe to: Posts (Atom)