EverWeb Widgetbox

Mobile Button Widget Pack

Why Use These Mobile Website Buttons?

Mobile versions of a website need to be lean, mean and fast loading. This means that the use of images should be kept to a minimum and this particularly applies to navigation butons which are present on every page.

These widgets provide all the essential buttons using CSS and HTML rather than images. They are sized to create an easy target for fingertips and have a choice of light or dark theme. Check out the dark theme in the page footer.

Home Button

To save space, the navigation only needs to be on the Home page. A Home button can replace it on all the other pages and, used in conjunction with the scroll to the top button, will quickly return visitors from any part of the site.

The widget inspector is shown to the right and all that is required is to select the appropriate button theme for the page background color and to check the box if the page containing the button is in a directory.

Smooth Scrolling Anchors

Website pages tend to be long and skinny on smart phones so anchors need to be used more often than on a traditonal site.

The anchor link button has a choice of up and down versions so that the corresponding anchor can be placed anywhere on the page to enable scrolling up as well as down.

The anchor for the button to the right has been command dragged into the footer to provide smooth scrolling to the bottom of the page.

Email Me

The EverWeb default Email Me button uses two images - one for Standard and one for Retina. The one shown to the above has zero file size.

The email subject line can be entered in addition to the email address.

Phone Button

A phone number will appear as a nasty looking blue hyperlink on iOS devices so it is best to use a button instead. This looks better and is a lot easier to tap. Simply enter the phone number as shown in the widget settings.

Contact

This creates a link to the page with contact form. It can be placed in the footer along with the email and phone buttons so that all the contact info is in one place on every page of the website.

Image Link

This widget allows the insertion of an image with alt text for SEO.

The image can also be created as a hyperlink. Along with the Link Buttons, image links can replace their text counterpart on mobile sites to make them a lot easier to navigate.

Mobile Home Button
Mobile Anchor Link

Anchor Widget

Drag the Anchor widget onto the page and enter the same ID as used in the hyperlink.

The widget will appear as a small rectangle as show in the screenshot to the right.

Drag this to the point on the page where the hyperlink will scroll to when clicked.

Anchor
Mobile Anchor
Mobile Email Button
Mobile Phone Button
Mobile Contact Button
everweb mobile website widgets
Mobile Website Link Button

A Back To The Top button is pretty much essential on sites designed to be viewed on smart phones. This widgets gives it a smooth scrolling action

Smooth Scroll To The Top

Button Themes

Note the examples of buttons using the Dark them in the footer of this page. Since the buttons have zero file size they can be used on every page in the footer for phone, email and contact links.

Get The Widget