Moving Pictures with Soliloquy WordPress Plugin

Simple WordPress moving pictures plugin

If you want moving pictures like the ones above, use the WordPress plugin called Soliloquy. It is fast, simple & easy to use. It is SEO friendly. While setting up the SEO features, you can even make any image link to another website!

How to set up Soliloquy

  1. In your WordPress dashboard go to Plugins > Add New
  2. Search for Soliloquy
  3. Beside the Soliloquy description box that shows up, click Install Now > Activate.
  4. Click on Soliloquy > Add New in the black dashboard column
  5. Give it a descriptive title
  6. Experiment with the two choices of sourcing files. The example above used “Other Sources” which were 5 pictures that were moving picturesalready in the website’s Media Library. Hold down the shift key while you click on the first & last pictures you want.
  7. Click Publish often
  8. moving picturesScroll down and look at your pictures.  (You should not have more than 5. That would slow your computer down.) Click moving pictureson the blue Edit button to improve SEO and to add a link to another website. Click on Config and experiment. Duration & speed are in milliseconds. So, 1000 would indicate one second. In the example above, the Slider Transition Speed was increased to 900.
  9. After you click the blue Update or Publish button and then click the Soliloquy Slider Code, you will see a snippet of code something like 
    .
  10. Add that snippet where you want the slide to show up, click Update and view your page. The slider will be working.
  11. If you want to edit the slider, click Edit Page and then Soliloquy > Soliloquy in your WordPress Dashboard.

More features for your moving pictures

In the sample above, you see 5 small circles that represent each of the 5 pictures. If you click on one of them, you will go to the corresponding picture and the slider will stop working. To disable this feature, you have to pay for the Pro version of Soliloquy.

 

Distorting Picture While Maintaining the Theme

Distorting a photo related to a business

distortingI needed a header for a Greenhouse’s website. I wanted the header to reflect the nature of the business. So, I took a hanging basket of petunias and began distorting them.

The petunias in the centre have very little distortion. The petunias within the letters have no distortion at all. The letters were madedistorting invisible on a white background. Then they were pasted onto part of the hanging basket.

These are the steps necessary for distorting the basket.

1. Erasing the background

distortingAdd an invisible layer behind the picture. Using the GIMP Erasure tool, erase much of the background. Then combine the Fuzzy Select tool to delete more of the background.

2. Ripple effect to distort

distortingUse the Ellipse Select tool to select part of the photo. Then click Filters > Distorts > Ripple. Experiment with the settings and then click OK. Keep one small area of flowers with no distortion. Apply ripples to the rest of it.

3. Increase opacity

distortingOverlay the photo with a white layer. Decrease the opacity. Merge the 2 layers.

4. Change to size of header

distortingMake a new box that’s the exact dimensions that the header should be. Change the latest petunia picture distortingto have the same length. Eyeballing it, select a rectangle from the hanging basket that has approximately the same dimensions as your new box. Scale the header image to be the prescribed dimensions of the real header.

5. Create letters with flowers inside

distortingSelect a large font such as Rockwell Bold. Using black text, key your words on a white background. Combine the Fuzzy Select tool with your Delete key to create invisible letters. Paste it onto an original photo of the hanging basket.

Using the Rectangle Select Tool and the Erasure, crop the letters so that they have a minimum amount of white around them. Paste them onto the image from point #4.

Creating a header in just 5 steps

By distorting a photo closely related to the theme of the website, you have created an appropriate header in just 5 steps. Go here to see the actual header.

Related page

How to Make a WordPress Twenty Sixteen Header

GIMP

GIMP is a free open source program. Programmers from all over the world collaborated to make a program similar to Photoshop.

When I downloaded a free version, it somehow came with lots of advertising that took me hours to purge from my system. For that reason, I suggest you go to the PhotoEditorX website, scroll all the way to the bottom and click the Download Now Button.

You can buy it for $47 USD. Not only do you get GIMP, but you get a large number of tutorials that will teach you how to get the most out of GIMP.

 

How to Find a Creator of Amazing Animated GIFs

Some of my recent animated GIFs

GIFsAs a VA (virtual assistant), I can research and write blog posts for you. I can also create YouTube videos & animated GIFs like the ones below.

Free YouTube course home.gif

GIFs

Creating a Pinterest pin.gif

GIFs

 

Aging Reversed 3 Pictures.gif

GIFs

Many social media.gif

GIFs

 

VA animated.gif

GIFs

Real men.gif

GIFs

 

Describes your day.gif

 

Keynote text effect Squish Flame.gif

 

YouTube black text to colour

 

7 Day logo Bitly.gif

GIFs

 

Learn YouTube housewife.gif

GIFs

Animated GIFs and marketing

Hybrids & CTA

The animations above are like hybrids between still pictures & videos. So, if used properly, they can tell a story more powerfully than still pictures.

Like still pictures, they can easily have a CTA (call to action). For example, if you click on the GIF above, you will be directed to a place where you can get a free YouTube video creation course.

Don’t be intrusive

A properly constructed animated GIF will guide the viewer to have the right marketing action or attitude without being intrusive.

Different viewers can tolerate different amounts of movement without being distracted. So, have enough movement to attract their attention without preventing them from reading your article.

Emotional impact

People buy for emotional reasons. Create your animated GIFs to create the right emotion.

This masterpiece from Cinemagraphs will connect with the audience emotionally.

I cannot say enough good things about Cinemagraphs. They are a creative studio specializing in the production of cinemagraphs, from concept to creation.

If you want super high-quality animated GIFs, ask Cinemagraphs to make them for you. Even if you do not want an animated GIF, go to their website now. Just consider it art appreciation.

 

 

 

 

 

GIFs

 


GIFsPeter Enns has been developing websites since 1996. He is a VA (virtual assistant), social media blogger and author of a free YouTube tutorial. It’s called 7 Day YouTube and will teach you how to make entertaining videos & animated GIFs.

tweets

Pinterest Pin, How to Make One

What are Pinterest pins?

Pinterest pinPinterest pins are visual bookmarks. They are pictures that you add to boards on the Pinterest website. Each pin links back to the website from which it came.

The animated GIF above illustrates how a Pinterest pin is created. That pin can be found on a web page called Value-added Email Marketing to Sell Online. If you find that pin on the Pinterest website and click on it, you will be taken to the Value Added Email website.

Characteristics of good Pinterest pins

  • Eye catching. You most likely would like people to add your pins to their web pages. So, it should have visual appeal.
  • 600 pixels wide. It is a good idea to make you pins exactly 600 pixels wide so that they are the same width as other pins on the Pinterest website.
  • Maximum 1900 pixels high. The maximum allowable height of a pin is 1900 pixels. Note that it is a good idea to make a pin long enough so that the viewer has to scroll down a bit. It gets them more involved.
  • Use a high quality photo editor.  I use GIMP.
  • Use a minimum amount of text.  Say what you need to say and say no more.

How to make a Pinterest pin in 4 steps

The above animated GIF takes 10 seconds to illustrate how to make an effective Pinterest pin. Let me expand that a little to explain what is happening.

I’m using social media to try to get people to my Email Marketing blog post. The half-life of a Pinterest pin is 1600 times longer than a Facebook post. It can be sending traffic to your website MONTHS after it was published. Keep that in mind while you are deciding how to make a particular pin.

1. Decide upon your main goal

My main goal for the example pin is to get people to a particular web post.

2. Decide what must be on the pin

My pin must show what are the benefits of going to the Email Marketing web page: learning how to

a. Collect visitors names & email addresses.
b. Sell things using that data.

Look at the pin below to see how I did that using the minimum number of words. (Notice how the words are surrounded with lots of white space.)

I had to tell people to go to a particular web page. In order to minimize the number of words, I used Bitly to shorten the URL from http://freewebdesign.club/value-added-email-marketing/ to bit.ly/emailselling. Not only is it shorter but it is easy to remember.

The form that collected the name & email had to be there as well as some other pictures that helped to tell the story.

3. Collect pictures

I performed a web search for “pinterest pins email marketing”. The picture on the right shows what I found.

I want people to select my pin when there are many other email marketing pins from which to choose. So, seeing those pins would help me with my creative processes. I want my pin to have more eye appeal than any of the others.

There are a number of websites where you can find free pictures. One of them can be found at bit.ly/nocostimages. It has free images, paid images and paid videos.

When I want pictures that make a Pinterest pin stand out, I always pay for mine. To find the main picture in the pin below, I went to a paid picture site and entered “email marketing” in the search box. It gave me hundreds of choices.

I chose the three images that you see in the pin below. I chose those 3 because they were all eye catching.

The top one makes an excellent title picture. The other two represent the idea of selling online using a list of email addresses.

Pinterest pin

 

 

 


Peter Enns has been developing websites since 1996. He is a social media blogger and author of a free YouTube tutorial. It’s called 7 Day YouTube and will teach you how to make entertaining videos & animated GIFs.

tweets

Social Media Manager’s Suggestions


Create an Animated GIF

click-here-start-online-business

The left-hand portion of this image was at the top of one of my blog posts.  Even though it said, “click here”, only one person clicked on it.  By combining that image into an animated GIF, I am hoping to increase my click-through rate.The above animation is telling people to click in a much more powerful way than the still picture ever could.  If you are into online marketing at all, it is important to learn how to make animated GIFs.

The purpose of the above animation is to create more calls to action (CTAs).  A good animated GIF can increase the CTAs without being too distracting.

Explain things in seconds

Watch the animated GIFs on this page. See how very complicated concepts can be explained in just seconds using an animated GIF.

Create your animated GIF in 6 steps

1. Choose the pictures you will usebuilt-in-effect

2. Set up your story on Keynote

 

3. Choose the effects you want

4. Using ScreenFlow 6.x or better, record your Keynote slide presentation

5. Edit ScreenFlow video to maximum size of 500 x 500 px. & shortest time reasonable.

screenflow-export-menu6. File > export. Set preset as animated GIF.  Click
on export button.

 

 


Peter Enns has been developing websites since 1996. He is a social media blogger and author of the free YouTube video-creation tutorial called 7 Day YouTube.

tweets

Webpage — Information, Aesthetics & Technical

3 characteristics of webpage presentationwebpage with Great Content

When judging how good a webpage is, there are 3 characteristics we look at:

  • How current and valuable the information is
  • Aesthetics, how attractive it is
  • Technical, how quickly does it load, do all of the hyperlinks work, etc.

1. Information

You want people to come back to your website.  So, they must feel like the information is valuable to them.  Does it sound original?

Is it current?  You need valuable information to keep each new post current.  Ideally your blog will have one main theme.  Every post and page in that blog will be related to that central theme.

Usually you should keep each post over 300 words.


&bnsp;

2. Aesthetics

  • Layout — How well is your web page laid out?
  • Ease of reading — Is it easy to read?
  • Pictures — Do the pictures assist with the reading experience?

Skim like an F

Brown letter FAlways keep in mind that people usually will not read your page.  They will skim it.

Expect them to just skim over it in the shape of a capital letter F. They will read the first few lines completely.  Then they will read the beginning of a few lines.  Then they will skim right down the page.

Bullet points

So, try to have lots of bullet points to help with the skimming right down.

Pictureswebpage Brain XRay in blue skull

Line Length

People prefer to read shorter lines. So,

  • Grab their attention in the first few lines
  • Make the first few lines short
  • Then they read the first few lines
  • After that you have them wanting to read
  • You can then continue article with longer lines
  • Start with shorter lines by having a picture at the top of the page like this.

 

3. Technical

Links

  • Test all of your links to make sure they work.  (It helps with SEO to have links to external sources.)
  • Have social media icons so that visitors can share your excellent content with their friends and colleagues.

Help pages load quickly

40% of people will abandon a site if it takes greater than 3 seconds to load.

  • Photo size — Don’t have photos larger then they have to be.  For example, I had an image with a “wow” factor that was 741 pixels wide.  It was 1.3MB in size.  When I selected a corner and made it smaller, it still was 1.3 MB in size.  However, when I opened it up in GIMP and used Image > Scale Image to reduce it to 400 pixels wide, it was 407 kB in size.
  • Block 3rd party cookiesReduces ad garbage
  • Search for load time reducing ideas.  Try reading How to Make Your Site Insanely Fast.

Reducing ad garbage

To reduce ad garbage, make a web search for how to block 3rd party cookies.  Here’s how to block 3rd party cookies with 2 different web browsers:

  • INTERNET EXPLORER: Tools> Internet Options> Privacy> Advanced:
    here check ‘Override automatic….’; ‘Allow session cookies’; ‘Allow 1st party cookies’ & ‘Block 3rd Party Cookies’.
  • firefox-add-onsFIREFOX: Tools> Options> Privacy: Check ‘Accept Cookies from sites’
    & Un-Check ‘Accept 3rd Party cookies’                          Firefox keeps changing their software.  With my version, I had to go to Tools > Add-ons and select the ad blocker (ABP) add-on.

“Wow” factor note

I promote each blog post using at least 3 different social media (Twitter, Facebook & Google Plus).  Here’s an example of how I promoted a post using 7 different social media.

Pictures are much more effective than words for getting points across.  So, I’ve started using an amazing picture at the top of each blog post.  Each social media post linking to that post will have the same picture.

 

 


Peter Enns has been developing websites since 1996. He is a social media blogger and author of the free YouTube video-creation tutorial called 7 Day YouTube.

tweets

Visuals to Enhance Your Message

Grab their attention for a few seconds

Visuals Cliffs from below 400

Website visitors are impatient.  They need visuals to distract them.  If they are not really interested in the first 3 seconds, they will probably leave your page.  So, use images with a “wow” factor to grab their attention.  The special picture should be above the fold if possible.

A picture is worth 1000 words

The brain processes a picture much faster than text — 60,000 times faster.  So, a picture is probably worth much more than 1000 words.

What makes visuals different from text?

  • Visuals are stored directly in the long-term memory
  • Text is stored in the short-term memory
  • Images increase comprehension, recollection and retention to a greater extent than text does
  • So, people are more likely to remember things on your web page if text is accompanied by a picture
  • Pictures enhance emotions more strongly than text.
  • Pictures engage the imagination to a greater extent than text
  • Pictures heighten creative thinking to a greater extent than text
  • The brain processes everything about a picture simultaneously
  • With text, the brain processes it one word at a time

Souces of visuals

SVisuals kitch optionsWhen you are explaining things, it often helps if you use a program such as Skitch to grab part of an image to explain a point.  Visuals help us decode text.

Sometimes, or probably usually, visitors will leave your page if you do not grab their attention within the first few seconds.  I often go to Adobe Stock and pay $3 for a photo that will “wow” people long enough to get them to read the page. 

Note that to use Adobe Stock you must pay $30 USD per month for 10 photos. If that is too much, try the nocostimages alternative.

Try going to 8 sources of free stock images.

Reduce the size of some images

Note that these Adobe Stock pictures will be very large and therefore slow down the speed at which your website opens.  So, to avoid losing viewers, use GIMP to reduce the size of an image.

If you have a 3 MB picture and drag a corner to make it smaller, it will still be a 3 MB picture.  So, go to GIMP and use used Image > Scale Image to reduce the size of a picture.

Today I had a 1.3 MB picture that was 700 pixels wide.  I used GIMP to reduce it to 400 pixels wide.  It was only 400 kB.

Social media marketing

Cliffs from below 400

I rarely make a social media post without having a photo that grabs people’s attention.  I’ll take the best picture from a blog post and have an image upload with that same picture in my posts on

  • Twitter
  • Facebook page
  • Google+

Each social media post will link back to the blog post.  The picture with a “wow” factor helps people to stay on my social media post long enough that they end up going to the blog.

The fold

The fold is the position on a web page where the majority of browsers viewing the page will begin to scroll.

Megabytes & kilobytes

A Mb is approximately 1000 times larger than a kB.  Specifically,

  • 1 byte = 8 bits
  • 1 Kilobyte = 1024 bytes
  • 1 Megabyte = 1024 Kilobytes

 

bit.ly/nocostimages

The Bitly address, bit.ly/nocostimages is an easy-to-remember web address for the Dreamstime website. Dreamstime has a collection of tens of millions of photos, illustrations, video snippets, etc. The lower quality images are free. The higher quality ones cost money. Dreamstime can be a very good source of free images.

In the above screenshot, someone searched All Content for pictures that represented designing websites.  What if your designing websites picture must match the blue colour in your header. Then you would add the word blue to your search term.

 


Peter Enns has been developing websites since 1996. He is a social media blogger and author of the free YouTube video-creation tutorial called 7 Day YouTube.

tweets

How to Use Maths Puzzles to Gain More Traffic

Most people love a number puzzle

Maths puzzles Genius testSemi genius math puzzleWhen you consider the popularity of Sudoku, you realize that people love maths puzzles.  Add one to your Facebook page and you can get lots of traffic to your blog.  That’s where people must go to find the answer.

The answer to the above puzzles are near the bottom of this web page.
How to create a math puzzle graphic.
How to find all of these related pages.

Related pages

Maths item of the month

The MEI website says

The MEI Maths Item of the Month is a monthly problem aimed at teachers and students of GCSE/A level Mathematics. The problems can be used for enrichment, problem solving or as a way to encourage mathematical thinking/proofRead more.

Maths tricks, puzzles, facts, etc.

The Maths Tricks Puzzles website says

Solve the puzzleRead much more.

Free maths puzzles course

The Course Guru website says

On this free online course, we’ll look at three types of maths puzzleRead more.

Cryptography

A GCHQ Twitter post says

The Applications of Probability to Cryptography…  Read more.

Maths puzzles with answers

The Pics Downloadz website says

Take another challenge in puzzles and solve this confusing math problem. In this puzzle, you will have…  Read more.

Like a crossword but with numbers

Cross figure puzzlesThe Krazydad website says

Here are eighty excellent Cross-figure (or figure logic) puzzles by Yochanan DvirRead more.

 Curated content

I wanted to write a blog post about maths puzzles.  So, I decided to curate the content.

I entered maths puzzles in the Google search box and began to search for posts about number puzzles.

I gave a quick summary of various websites.

Puzzle answers

Genius text 1 3 7 13If you are still wondering why y = 73, consider this formula: y = x(x – 1) + 1.  Sample a few numbers.  For instance, when x = 5, y = 5(5 – 1) + 1 = 5 x 4 + 1 = 21.  That checks out with the genius test to the left.

 

Semi genius math puzzle

 

The formula for this one is y = 2x2 – 1.  So, y = 2(62) – 1 = 72 – 1 = 71

How to create the genius test graphic

The genius test graphic will be displayed on more than this page and my Facebook page. It is a marketing tool to get people to my blog.

So, I wanted to use decent aesthetics and other marketing features. Here are the steps I used using the free GIMP photo editing software.

♦ Open GIMP
Blog on Barn Board♦ Open the blog on barn board graphic
Layers Panel new layerClick Image > Scale Image to reduce the width to 600 pixels
♦ Right-click on the Layers panel and select New Layer
Opacity layerClick the White radio button and then OK
♦ Reduce the Opacity to 90
♦ Right Click > Merge Down in layers panel
Color Picker Tool 2♦ Use Color Picker tool to select a color from the blog graphic.
♦ This will create a foreground color Genius text 1 3 7 13for your keystrokes when you create the puzzle.
♦ Type out the text
♦ Right-click in the Layers panel and select Merge Down.
♦ Click the double headed arrow beside the background and foreground colors
♦ While the genius test is still selected, click File > New
Math Puzzles Pinterest 2Add 20 pixels to default width and height of your new rectangle.
♦ Click OK and this will produce a rectangle same color as text
♦ Click on the test graphic and press Cmd C to copy it into your clipboard
♦ Click on your new colored rectangle and press Cmd V to paste the test graphic onto the colored rectangle
♦ Right-click in your Layers panel and select Anchor Layer
♦ Now your text graphic will have a 10-pixel border around it
♦ Select your blog on barn board graphic and click Image > Scale Image
Make it into a tiny image, click on it and press Cmd C to copy it into your clipboard
♦ Click on your math puzzle, press Cmd V and drag the tiny image to the place you want it to stay
♦ Right click on the Layers panel and select Anchor Layer
♦ Save the puzzle with a descriptive name, export it as a PNG file and upload it to your Facebook page 

drop down  drop downFacebook logo

 

 

 

 

 


Peter Enns has been developing websites since 1996. He is a social media blogger and author of the free YouTube video-creation tutorial called 7 Day YouTube.

tweets

Image to Text, Tell a Story

Change a picture to text

Ski image to text

Suppose you were going to design a pamphlet for a ski resort.  Using the GIMP image to text system, you can display the text as a picture of the ski hill.

Image to text in 21 steps

  1. Open GIMP
  2. Open a new file with a white background.
  3. Click on text icon in toolbox.
  4. GIMP fontsLook at fonts in Tool Option panel.  Click on a thick one to select it.
  5. Key in word in black text
  6. Enlarge it but make sure some white space is around it.
  7. Crop it
  8. Right-click in the Layers panel and select New Layer
  9. Make sure you select Transparency and click OK
  10. S K I checkersRight-click again in the Layers panel and click Merge Down. (This allows you to erase.  Where the checkers appear beneath the picture, a transparent area has been created.)
  11. Fuzzy select toolClick the Fuzzy Select Tool.
  12. As you click on each letter and then press the Delete key, the black letter will disappear and become transparent.
  13. Download the background photo.  Make sure the width matches the width of the text.
  14. Click on the text image and press Cmd C to copy it into your clipboard.
  15. Press Cmd V in your background picture and move the text to the ideal position.
  16. Click on the background picture so that your text is anchored.
  17. Select a rectangle around the text.  Make sure you have enough white space.
  18. Click Image > Crop to Selection.
  19. Save your new image with a descriptive name.
  20. Export it as a PNG file into your Pictures folder.
  21. Go to your Pictures folder and double click on the name of your new image.

It is ready for you to use in your promotion.

If you had trouble following those 21 steps, watch the YouTube video again.

Image to text with Photoshop

Here’s how to change image to text to a photo with Photoshop.

 

 


Peter Enns has been developing websites since 1996. He is a social media blogger and author of the free YouTube video-creation tutorial called 7 Day YouTube.

tweets

Photo Editing Software, Photoshop vs. GIMP

Photo editing and effects

Checker board ball skyWhen it comes to photo editing software and those special effects you want, should you buy PhotoShop?  Or, should you get the free GIMP?

The answer is, “It depends upon your needs.”

GIMP covers most people’s needs

GIMP toolbox 2The Business to Community website says

Like Photoshop, GIMP supports the basic functions needed to manipulate images. GIMP supports levels, curves, layers, channel mixing, cloning, healing, transformation, editable text, etc. For many photographers and designers, this covers the vast majority of their needs. That said, there are many Photoshop features that haven’t (yet) made it over to GIMP.                Read more

Graphic designer, scientist,…

Blog Oklahoma says

GIMP is a cross-platform image editor available for GNU/Linux, OS X, Windows and more operating systems. It is free software, you can change its source code and distribute your changes. Whether you are a graphic designer, photographer, illustrator, or scientist, GIMP provides you with sophisticated tools to get your job done.     Read more.

Photo manipulation

A Technology Study Guide SlideShare presentation says

You can use GIMP for simple “paint” style projects or utilize its extremely powerful photo manipulation systemLearn more.

This photo editing software was developed by volunteers

A Wikipedia article says

GIMP is primarily developed by volunteers as a free software project.   Read much more

GIMP’s much cheaper

A Tech World article says

So, if you don’t want to shell out the big bucks for the likes of Photoshop you can’t beat GIMP’s price and there are a huge number of training guides on the GIMP site and elsewhere online.    Read the rest of the article.

Photographer switches to GIMP photo editing software

The LifeHacker website says

Over six months ago, I stopped using Adobe Photoshop and switched to the open source alternative, GIMP, for all my personal photography projects. This wasn’t the impossible task that most people believe it is.   Read more.

 

 

 

 


Peter Enns has been developing websites since 1996. He is a social media blogger and author of the free YouTube video-creation tutorial called 7 Day YouTube.

tweets