Mac SEO Blog

The Image Gallery Widget is one of the EverWeb’s original set of widgets included in the product when it debuted back in November 2013. The widget is designed to show off your images in an organised manner and at first it only included four basic options. Seven years later, the addition of many new and enhanced features, the widget gives you an easy yet flexible way to display your images to their best effect.

The Image Gallery Widget 2020

The Image Gallery Widget has come along way for sure, but one of its enduring features is that you can still drag and drop your images on to the widget in the Editor Window. Images can be drag and dropped from either the Assets List or from another source such as the desktop or from a Finder Window. Reordering images within the widget also remains the same, just drag and drop the image you want to move from its original location to its new location within the widget. All wonderfully easy!

What the current version of the widget has over the original version is an Assets List in the Widget Settings tab so that you can easily see the file names of your images. The Assets List also provides an alternative method of adding, moving and deleting images from the widget.

Moving the Image Gallery Widget

Whilst dragging and dropping images on to the Image Gallery widget is consentient, moving the widget itself around the page could in the past cause some issues. In EverWeb 1.0, you had to make sure that you grabbed the widget in exactly the right spot to be able to move it around the page, otherwise you could be grabbing one of the images within it instead! Later versions of EverWeb added a small ‘+’ symbol in the widget’s top right hand corner which you could click and drag to move the widget around the page. In the latest version of EverWeb you get a more prominent coloured directional indicator in the top right hand corner of the widget to make moving it around super easy.

An Improved Appearance

The original widget only allowed you to change the size of the image thumbnail and the spacing between images, whilst the most recent version of the widget gives you a wide range of options to control the appearance of your image gallery. You can now have up to six columns in the gallery and you can set how many images per page you want. The Image Gallery can display its images in Portrait, Landscape, Fill, Fit or Default gallery sizes. There is also an option to caption your images as well.

An Improved Slideshow

The Slideshow feature of the widget in version 1.0 was again very basic as you could only change the slideshow time and whether to autoplay the slideshow or not. Things have come a long way as you can now control the image size (Larger images and slower download times, or smaller images and faster download times). There are also options within the slideshow to show Social Media buttons, a Zoom button, Full Screen button and Download button. All these options have also recently debuted in a new slick, updated, responsive slideshow bringing the feature nicely in to 2020!

Improved Image Gallery Pagination

The most recent update to the Image Gallery Widget added a new Pagination feature to the widget. If you are familiar with Blog Post Pagination you will notice the similarity. Pagination helps your visitors easily move between gallery pages when you have more than one page of images to display. Whilst there has been pagination in the Image Gallery Widget for a long time, the feature was not easy to stylize until EverWeb version 3.2. Now you can have pagination buttons at the top, bottom or top and bottom of the gallery. The pagination buttons can be customized to include the background, mouse over, selected and deselected background colors that you want for your site. You also have control over the corner radius of your buttons and how far the buttons are spaced apart.

If you want to change the font and size of the pagination numbers, just click inside the pagination area, then press Command+T to call up the Fonts Panel. Select the Font and Font Size that you want from there! If you want to change the color of the pagination numbers, go to the Hyperlinks Inspector. Remember that the pagination buttons are links! Set the colors and underlines of these links using the Normal Rollover and Visited options.

EverWeb’s Image Gallery has come a long way since its debut. If you want a quick, easy and flexible way to display images in your website, check it out!

EverWeb on Social Media

You can also find EverWeb on the following social media platforms:

Facebook

Flipboard

YouTube

Twitter

Instagram

Creating the design theme for your website is one of the most important decisions you will make when building your EverWeb created website. Your website’s theme defines who, and what, you are on the Internet so taking the time to get it right first time is important. But what of your blog? Should you adopt the theme of your website or should you do something a little different? Many website designers and bloggers choose the latter option, creating their different theme to that used for the main site.

There are good reasons for creating a distinct look for your blog. The first is exactly that – it is distinct – telling your visitors that they are in a part of your site that is different to the rest of it. A blog is where you create more in-depth content, or content that is more immediate to communicate, or where opinions and discussions are invited and so forth. As such, it is often a good idea to give the blog its own design identity. Something similar, but different, to the main site design is usually the best approach. In this way you maintain the site’s aesthetic whilst signalling visitors that they are in a specifically different area of the site.

When designing the theme to your blog, bear in mind that you will probably want to create one design for the blog main/archive pages and one for the blog posts page. Here we look specifically at the blog posts page as there are design options only available to this page type.

Creating a Blog Post Theme Template

There are three ways in which you can create a blog post theme template:

EverWeb’s Master Pages Feature

The Master Page feature can be used on any page in your website, and the blog main/archive pages and the blog posts page are no exception. Click on the posts page in the Web Page List, then go to the Page Settings tab of the Inspector Window to the right of the Editor Window. The first section of the Page Settings tab is where you attach your Master Page. Use the dropdown to select the Master Page that you want to apply to the blog posts page. When you have selected the Master Page, it will be applied to all of the blog posts.

The Live Blog Post Preview Window

In the Blog Posts page, you have the Blog Posts Editor Window where you add your post’s text and images. The window below the Blog Posts Editor Window is the Blog Posts Preview Window. This is where you see a live, real time preview of how the post will look when it is published. This is typical for blogging, where the editor window is used just to input text and images, whilst the preview window deals with the formatting tasks.

If you add objects in to the Blog Posts Preview Window, they will appear on all of your blog posts. This sometimes catches people out so be aware of it when you start adding objects!

To set up the fonts of the blog post’s Title and Date fields, go to the Widget Settings and use the ‘Title Style’, ‘Date Format’ and ‘Date Style’ fields. The font of the post itself is controlled in the Blog Post Editor Window so that you can have different fonts for different blog post entries if you want.

Most of the other features in the Blog Post Preview Window are also controlled using the Widget Settings e.g. Navigation Links and Blog Post Cover Image settings. Other general page settings work in the same way as for regular pages in EverWeb, for example, Page and Browser Background colors and page dimensions are set from the Page Settings tab.

Combining a Master Page with the Blog Post Preview Window

The third option available to you is to combine the above two options. This is useful when you want to keep some elements of your blog post page design fixed and some elements flexible. For example, you may want to keep the header and footer areas of your post fixed. In this case you may want to place such objects in a blog post Master Page. In the Blog Post Preview Window you would see these objects with the black page symbol displayed in their top right hand cornets indicating that they can only be edited by editing the Master Page itself.

For objects that may change over time (e.g. you may have a special offer banner that is time limited) you could use the live Blog Posts Preview Window for these types of object. In this way you retain the overall blog post design whilst having the flexibility you need when you want it!

Which Approach Is Best For Your Blog Posts?

The approach that you choose is really dependent on the requirement of your website. Knowing the ways in which you can create template pages for blog posts is the key as to the method that you will use when it comes to creating your own blog post theme template.

If you have a comment about this blog post, please do let us know in the Comments Section below. We’re happy to help!

EverWeb on Social Media

You can also find EverWeb on the following social media platforms:

Facebook

Flipboard

YouTube

Twitter

Instagram

Responsive Web Design is the website paradigm of today. Creating websites using scaleable pages was for a long time the holy grail of website design. And with good reason too, as if done correctly, pages created in this way look and work fantastically on all devices that they are displayed upon.

The problem with this concept though, are the words ‘if done correctly‘. Responsive Web Design is, in itself, a more complex design paradigm to get your head around than fixed width page designs. There’s also the matter of design freedom Many website designers prefer using fixed width page layouts, such as the centered page layout in EverWeb, as such layouts allow text, images and other media to be placed freely on the page. Responsive Website Design is often seen as more restrictive in this respect.

There are many pros and cons in both responsive and fixed width design strategies and there is no definitive answer as to which approach is better. However, it is usually best to build your website in the way that suits your website’s goals and requirements. From this starting point, the choice over which page layout style to use should be easier.

What is certain, though, is that Responsive Website Design is here to stay. If you have EverWeb 2.8 or higher, the responsive page layout is built in to the product.

For a full deep dive in to Responsive Web Design in EverWeb, check out our YouTube videos and the EverWeb User Manual which includes a dedicated chapter on Responsive Web Design. In addition to these resources, here are some EverWeb responsive page design tips to help you along the way.

1. Update EverWeb to the latest version. Since the introduction of the responsive page layout in EverWeb 2.8, there have been many additions and enhancements to the tools that you can use to create responsive web pages. For example, the Metrics Inspector has added maximum content width, show on device and breakpoints. There is also responsive ‘Set shape as scroll position‘ which enables robust object hyperlinking in a responsive environment. The Shape Options tab has added full width background fill capabilities for full width widgets. The Responsive Row, FlexBox, Text Section and Responsive Image Gallery widgets have all been upgraded and most other widgets have gained full width capability.
2. The FlexBox Widget Is Your Go To Solution! Designing a website means making lots of choices. In responsive page layouts, the FlexBox widget will probably be your widget of choice to make your page design the best it can be. When combining objects together, such as text and images or images, video and text, or when you need to add a button in to the mix, the FlexBox widget has the most options and flexibility. The widget can even be a great solution when you are using only type of object on your page. If you cannot decide which widget is best to use to solve your design issues, try the FlexBox widget first!
3. Responsive Row Widget Overuse. Often the Responsive Row widget is used for everything even when it is not needed. Whilst the widget is a ‘jack of all trades’, using it when you do not need to complicates your design and adds unnecessary code to your page. Check out our ‘Responsive Row: To Use or Not To Use‘ blog for more hints and tips on when, and when not, to use the Responsive Row widget.
4. Check Out Show on Device! Even though Responsive Web Design is the one page solution for all device types, you may find that sometimes you need a particular design solution for one, or more, device types. This is especially so when viewing pages on mobile devices where horizontal space is limited and you do not want a page height that has your visitor scrolling seemingly forever. EverWeb’s Show on Device feature lets you control when you see objects that are inside a Responsive Row widget. For example, your Responsive Row widget contains two images and a TextBox. The TextBox has a large amount of text within it. This is fine when viewed on a desktop or tablet computer. On a mobile device, however, you may want just a summary of the text instead. To do this, duplicate the TextBox in the Responsive Row widget. Edit the text of the duplicate to produce your summary text. Then go the Metrics Inspector and uncheck all of the Show on Device options except ‘Mobile’. For the original full text TextBox, uncheck Show on Device only for ‘Mobile’. In this way you will get the full text on all devices except mobile, and you will get the summary text only on mobile devices.
5. Margins. Setting left and right page margins really comes in to play when your page is displayed on mobile devices where you do not want your content up against the left and right edges of the screen. Usually, setting a margin of about 30 pixels from the Metrics Inspector will give you enough left and right margin space. If you are setting margins for a Responsive Row widget, remember to make sure that the objects within still fit properly. Use Preview to test and reduce the width of any fixed width objects inside the Responsive Row widget if you need to.
6. Maximum Content Width. As you increase the width of your browser, you may find that objects on your page get too spaced apart from each other. Using Maximum Content Width you can fix the width of the selected full width object to a specific maximum value. The objects inside the full width object will not stretch out beyond the value you set.
7. Look for Simple Solutions. One of the things you should never forget when designing is that often we overlook simple solutions to design problems. For example, you may be tempted to add a full width TextBox in to a Responsive Row widget in order to get extra top and bottom padding. However, you do not actually need to do this as you can use the Insert Margin, Before Paragraph and After Paragraph controls in the Text Inspector to do just this. Remembering simple solutions will make your site easier to manage and maintain in the long run.

If you have your own tip on how to make a better responsive page in EverWeb, why not share it with the community in the Comments Section below. We would love to hear from you!

Gumroad is a website that brings ‘super simple commerce to creators’. Creatives specialising in films, courses, music, books, comics and other genres use Gumroad to easily sell their products on line.

Gumroad includes a simple set up, a heavily optimized purchase experience and backend tools to analyse your sales data, manage your customers and build your audience.

Integrating Gumroad with EverWeb

Integrating Gumroad with your EverWeb website is easy as there are a number of ways in which you to do this. Such flexibility means that you can sell your products in whichever way is best for your existing and potential online audience. If you want, you can also sell physical goods as well.

When you begin using Gumroad, you will first add a product to your profile. When you add your first product, you will eventually come to the Share Your Product screen…

If you have previously added a product, go to the Products menu, then select the product that you have already added, then select the Share menu option.

There are three ways in which you can link to Gumroad from within your EverWeb website.

Using a URL Link

The first method is by adding a URL link in to your site. Use the ‘Copy URL’ button in the ‘Share your product’ screen to copy your product link to the Clipboard. 

Next go to your page in EverWeb where you want to place the link. You can use a EverWeb’s Hyperlink Inspector to link the Gumroad URL to a piece of text or an image, or you can add the link to a link button in, for example, the FlexBox Widget.

When using the FlexBox widget, select the Embedded Object that you want to attach the link to in the Widget Settings. Next, scroll down to the Link button in the Button Settings section of the widget. Click on the ‘Link’ button and paste the Gumroad URL in to the URL field. Click OK to finish then preview, or Publish, your page to test the button.

Using Gumroad’s Overlay Widget

The second option is to use Gumroad’s Overlay widget. Using the Overlay widget allow your website to have inline purchases without having to leave your site. You can customize the widget’s button text and there are also options to automatically trigger a payment form and to allow single product purchases.

Once you have set your text and options, click on the ‘Copy’ button to copy the generated code to the clipboard 

Next go to the page in EverWeb where you want to add your product. If you are using a Responsive Page Layout, you will first need to have a Responsive Row widget on your page. If you do not have this widget on your page, drag and drop it on to the page and position it where you want it.

With the Responsive Row widget in place, go back to the Widgets tab and drag and drop the HTML Snippet widget on to the page. In the HTML Code box of the widget, paste in the code from the clipboard. Click on the ‘Apply’ button when done. The Editor Window will update. Preview or publish your site to test.

Using the Gumroad’s Embed Widget

The last option is the Embed widget which lets you embed your products in to your website. This is also a useful option if you do not have an HTTPS website. 

Select the Embed widget option and, as before, use the ‘Copy’ button to copy the code to the clipboard.

As with the Overlay widget option above, you will again need to drag and drop an HTML Snippet widget in to a Responsive Row widget on your page. In the HTML Code box, paste the code from the clipboard and press ‘Apply’ to finish. The Editor Window will update. Preview or publish your site to test. 

If you are using a Centered or Left Aligned page layout, you can add the HTML Snippet widget anywhere on your page. The Responsive Row widget is only needed for the HTML Snippet widget when using a Responsive Page Layout.

Watch The Video

Check out the link below for a video walkthrough that shows you how to link your Gumroad products in EverWeb.

When most people hear the words ‘website maintenance’ the response will typically be along the lines of “Tomorrow”, “I’m too busy”, “I’ll do it later” or something similar! Yes, it can be a dry subject, but it can be a very positive experience for both you and your website visitors. Here are some tips to help inspire you to do a bit of maintenance on your EverWeb created website from time to time!

1. Update EverWeb To the Latest Version. The first action to take when talking about website maintenance is to download the latest version of EverWeb. Apart from new and updated features, there are always bug fixes and optimizations included in each release.
2. Republish Your Website. In every release of EverWeb we look at getting code even more efficient! This applies to both the EverWeb app itself, and to the code that gets generated when you publish your website. For example, in EverWeb 3.3 the app itself should run faster and be more responsive. If you publish your entire site using the File-> Publish Entire Site menu option, you should also find that your web pages load quicker and are more responsive in use. In a Google Page Analysis, you should see page load speeds improve by 50% from EverWeb 3.2 to 3.3.
3. Reduce the Size of Your Project File I. If your website has assets that are not used, and that you are never going to use, in your Project File, why not delete them? Deleting unused asset will reduce the size of the Project File so that it will be quicker to load when opened, and also faster to work with when opened. Click on the Settings Cog in the Assets tab and choose ‘Find Unused Assets’ from the contextual menu and follow the instructions.
4. Reduce the Size of Your Project File II. Whist the Assets tab is open, why not check to see if you have any unnecessarily large image file assets in your Project. Large image files will drag down page load speeds and that is not good for your visitor experience. You should replace any large files with more web friendly versions e.g. if you have a large .PNG file, you could replace it with a JPG file which takes up less space. Reducing the size of large image files will improve your page load times in browsers, and will also reduce the size of your Project File.
5. Use EverWeb’s BackUp Feature. Backing up your project file is something that you should always do. Sometimes this will be included in your computer’s backup (if you don’t back up your computer, please try to on a regular basis!) The EverWeb Backup process will allow you to backup your project files on a daily, weekly or monthly basis. EverWeb can also keep either 1. 5, 10, 20 or 100 backup copies. To setup your Backup, go to the EverWeb-> Preferences menu and select the BackUp option.
6. Reclaim Some Disk Space. Like many apps, EverWeb generates cache files whilst you are using the app which are deleted when you quit. There are some instances such as when publishing or previewing, that these cache files are kept in order to help speed and performance. You can delete these cache files if you want e.g. if you have old, or abandoned Projects that are no longer on your computer, you can remove the cache files. You can also delete any unwanted Backup files that you may have. To delete these files, go to the EverWeb-> Preferences menu and choose the Backup tab. Click on the Manage Cache Files button and follow the instructions to remove the files that you no longer need.
7. Out with the Old… EverWeb is constantly adding new and improved features to make your website development easier and quicker. This may mean that over time some of the features in your website may benefit from being replaced by such new or updated features. A good example of this is the PayPal widget. Before EverWeb 2.8, you would have to insert your product image, product description and PayPal widget as separate objects then align them. This is now no longer necessary as from EverWeb 2.8 there are now product image and description fields built directly in to the PayPal widget.
8. Check your SEO. Over time you may find that the direction of your business changes. If this happens, you may want to double check that your website’s SEO is not outdated. It is easy to update the contents of your page, but often it is easy to overlook its SEO. If you need an SEO refresher, checkout the SEO for EverWeb Video Course.
9. Update Your Website’s Content. Updating your website’s content should be something that is done on a regular basis. It is a good way to show existing and potential customers that you are still in business. Websites that are not regularly updated, or are not updated at all, give the impression that they are not invested in their visitors and so potential and existing clients have a greater tendency to click away from such sites. Updating your website’s home page and blog on a regular basis may help retain and even grow your business.
10. Do Your Documentation! The last way to maintain your website is to document it. Even if it is bare-bones documentation, something is better than nothing. Think about the essentials that you need to document e.g. the style of your website (fonts, colors etc), your website links, the STMP Settings details of your Contact Form Advanced widget and so on. You may find that even noting down the very basics may one day pay off, saving you time, effort and frustration!

If you are goal oriented about website maintenance, you may find that you can maintain and grow your existing business. A little effort can reap rewards!

If you have a website maintenance tip of your own, please let us know in the Comments section below!

EverWeb’s third party provider community continues to expand with the recent arrival of EverWeb Garden. This new third party provides additional widgets to supplement those that are built in to EverWeb already.

At launch, EverWeb Garden has about 60 widgets to choose from with more to follow. At the moment these widgets are free as they are in a limited time beta test period.

A Broad Choice of Widgets

EverWeb Garden not only has a large number of widgets ready at launch, but the widgets themselves are great for enhancing your website. The widgets have a modern design approach and are highly customizable to suit your needs and match the look and feel of your website. Below is a short summary of some of the categories and widgets that are available.

Media Themed Widgets

There are a host of media themed widgets available such as the Soundloud widget . This widget lets you copy a song’s URL from SoundCloud with the SoundCloud widget, and add options such as download, share and buy buttons as well as adding the song’s artwork.

The EventBrite widget allows you to sell tickets for events and lets your customers purchase from within your site.

Other media themed widgets include Video, YouTube and Flickr Galleries and customizable Plyr audio, video and Vimeo player widgets.

Widgets That Work With Data

If you have ever wanted a table, list, pricing grid or piechart in your web page, EverWeb Garden has you covered with widgets to meet these needs. There’s even a calendar widget too. Again these widgets offer easy and full customizations.

New Style Navigation and Notification Widgets

There are plenty of navigation themed widgets to suit almost all website needs including a fly-out menu, Hidden menu and fading navigation menus. If you want to catch your visitors attention, there are also popup notification widgets available.

Enhanced Design Widgets

If you want your site to really shine, there are new widgets that just do that by displaying images in cool new ways, a variety of sliders and there’s a tabs widget, tip cards and a lonely card widget to add extra pizzaz to your pages!

E-Commerce Widgets

If you have a PayPal account you have two E-Store widgets to enhance your product listings.

More About EverWeb Garden

EverWeb Garden at launch will feature different yearly Standard, Advanced and Pro plans. The Pro plan, for example, will include custom widget development, standard and premium widgets as well as an ‘early widget access’ and priority support.

If you download EverWeb Garden widgets during the beta test period, or purchase them directly once they are out of beta, remember that for any support on these widgets, please contact EverWeb Gardens directly.

So, sign up now for a wealth of free widgets before the beta test period ends, the clock is ticking!

EverWeb on Social Media

You can also find EverWeb on the following social media platforms:

Facebook

Flipboard

YouTube

Twitter

Instagram

One of the things that we always strive for in EverWeb is to make things as simple as possible. Usually this means trying to apply simplicity to often complex tasks of features. Take responsive web design in EverWeb as an example, where we made something that is conceptually difficult easy for EverWeb’s fixed width website builders to grasp. The new responsive paradigm takes EverWeb users to a new level of website building!

The PayPal widget is another great way in which complexity is simplified. The widget lets you build your own e-commerce store with Buy Now, Add To Cart, View Cart and Donate buttons without having to go in to PayPal itself. Many of the most commonly used PayPal options are immediately available in its Widget Settings.

Simplicity in EverWeb also comes in ways in which we only really appreciate when we discover them. In EverWeb version 3.3 we have added a very simple new way to update widgets simultaneously. This, of course, is a great time saving feature, especially when e.g. you need to update multiple PayPal widgets on your web page with a new look ‘Buy Now’ button.

How To Simultaneously Update Widgets

When it comes to simultaneously updating your widgets, there are a couple of things to note. The first is that you can only simultaneously update widgets of the same type e.g. only PayPal widget or only FlexBox widgets. The second point to note is that you can only update widgets on a per page basis.

With the above rules in mind, updating is easy. Using the PayPal widget provides a perfect example, because if you have an online store page in your site, updating each individual PayPal widget with e.g. a new ‘Buy Now’ button can potentially take a long time!

All you need to do is to select all of the PayPal widgets on your page that you want to update. Once they are all selected, go to the Widget Settings and, in this example, change the button style from say the default ‘Buy Now’ button to either a Custom Pay Button Image or a Styled Button. Once you make the change, all of the selected PayPal widgets will update.

This feature is very useful in the PayPal widget as you can also easily change your Form Alignment all at one time, change the shipping fees or even update the email address used for PayPal in the widget.

One important point to note is that you should be careful about what you are updating. Staying with the PayPal widget as an example, if I decided that once I have new buttons, I could update the font use in the Product Description. If I highlight my text and change the font, hey presto! All of the PayPal Widgets selected will have their font update. They will also have their text updated too! So caution is advised when using this feature. In this example, you can try to back out of the change by using the Undo command (Cmd+Z).

One Thing Not To Forget!

The above example shows what can happen if you forget to deselect the widgets after you have made the wholesale changes that you want. Remember that once you have finished updating your widgets, click on a different part of your page to deselect the widgets!

New Feature, Old Feature!

Whilst being able to update the same type of widget simultaneously is a new feature for EverWeb’s widgets, this feature has been a staple for other object types such as TextBoxes, Shapes and Images since EverWeb 1.0. Typically, you can change most aspects of the selected objects using the Shape Options and Metrics Inspectors. When updating TextBoxes, it is possible to update the text font without the text being updated at the same time. In this instance, you can only select all of the TextBoxes. You cannot select the text within more than one TextBox at any one time. Once you have selected the TextBoxes you want to update, click on the Fonts Panel button (or use the Cmd+T command) and change the font to the one you want.

EverWeb on Social Media

You can also find EverWeb on the following social media platforms:

Facebook

Flipboard

YouTube

Twitter

Instagram

If you have either a small or large EverWeb built website, you will find much to enjoy in our recent EverWeb 3.3 release. Much work in this release has been focused on ‘under the hood’ improvements to make working with EverWeb and your published website faster than ever!

Improved Speed and Optimizations!

For EverWeb 3.3 we looked at every area of the product to see where we could apply optimizations to make creating your website faster and more responsive than ever!

Performance improvement start when opening your project file which should now be quicker. Adding a new page to your site will be snappier, editing a blog post smoother, and previewing and publishing are quicker than ever.

EverWeb in general should be smoother as the Editor Window now refreshes faster when you update any field or setting in the Inspector Window. When resizing the EverWeb app itself, you should also see a faster refresh too.

We also took time out to re-engineer EverWeb’s widgets so that you get speed improvements of up to 700% in the Editor Window’s refresh performance when updating the Widget Settings. This improvement also translates to your published website, especially if you use a responsive page layout. Your pages will load faster, regardless of whether you are using EverWeb’s built in widgets, or those from a third party provider.

Performance improvements have also been applied to blogging where you should see a more streamlined experience when adding new posts and editing posts.

How To Speed Up Your Website

For your website to benefit from the speed improvements in EverWeb 3.3, all you need to publish your complete site using the File-> Publish Entire Site menu command. When you do this, EverWeb now will now delay some webpage scripts from loading leading to a significant improvement in the performance of your website. Your website visitors will see the benefit and there is also the bonus that this improvement will help boost your search engine rankings!

EverWeb’s New Search Options

As well as speed improvements and optimizations, you can now search your project file for almost anything! EverWeb’s new search features will save you time, especially if you are working on a large project file that includes a lot of pages. EverWeb’s new search abilities start when you add your first page to your project file. If you know the name of the Theme Template that you are looking for, you can quickly find it using the search box in the bottom left hand corner of the Theme Template Chooser dialog box. Alternatively, you can also use predictive search. When the Theme Template Chooser appears, start typing in the name of the Theme Template that you want. As you type, EverWeb will ‘home in’ on the template that you want.

Search has also been added to the Widgets tab in addition to the Assets tab. This is an especially useful option for those who have a lot of third party widgets installed. Searching for the widget you want has never been quicker or easier!

You can now also search for the page that you are looking for using the new search feature that is at the bottom of the Web Page List. Again this is a feature that will typically be of most use in large website project files. Searching for the page you want when you have a project file full of nested folders and hundreds of pages is now simple and easy.

Retracing Your Steps

If you ever need to retrace your steps when working in EverWeb, you can now step through the pages that you have already visited in your current session by using the forward and back arrows to the left of the Web Page List’s search box. This is a useful feature when, for example, you want to track changes that you are making to a number of different pages in your site and you can’t remember which pages you have already changed. Just step through the pages you have already visited using the back and forward arrows.

Finding and Replacing Your Words

Whilst Find and Replace is a long standing feature of EverWeb, it usually does not get too much coverage. However it is a great time saver that may be easily overlooked. If you need to find, or replace, words on your page, just use the Edit-> Find menu option, or the Command+F shortcut key, to call up the Find Panel. Enter the characters that you are looking for, then click on the Next button. As you would expect this feature works like it would in a word processing app, so you can also Find and Replace, either incrementally or using the Replace button, or globally on the page using Replace All. Note that this feature only works on TextBoxes, so it will not work where you have text within widgets or in blog posts.

Blog Search

Although not a feature of EverWeb itself, you can now let your visitors search any blog that you may have in your site. EverWeb PowerUp now provides a free to use Blog Search widget! You can find out more, either directly from the EverWeb PowerUp website or find out more in All About iWeb’s ‘EverWeb PowerUp Adds New Free Blog Search Widget!‘ blog post.

EverWeb 3.3 is a highly recommended update as it brings speed improvements, code improvements and EverWeb wide search capabilities!

EverWeb on Social Media

You can also find EverWeb on the following social media platforms:

Facebook

Flipboard

YouTube

Twitter

Instagram

We’re delighted to introduce EverWeb 3.3 which includes new ways to search for Theme Templates, widgets and pages in the Web Page List. There are also dramatic optimizations which will make EverWeb faster to use and also make your website faster for your visitors too. Get improved Google page speed grade of up to 50%

EverWeb 3.3 is a big under the hood update! For a complete list of what’s new, improved and fixed, as well as how to upgrade to the new version, please see below,

You can also check out EverWeb’s new features in our ‘What’s New in EverWeb 3.3‘ video.

Which Version of EverWeb is For You?

EverWeb is available in the following versions:

• If you are running OS X 10.10 or macOS Yosemite, El Capitan, Sierra, High Sierra, Mojave or Catalina, EverWeb version 3.3 is available for you.
• If you are running OS X 10.7 – 10.9 (Lion, Mountain Lion, Mavericks) EverWeb version 3.1 is available for you.
• If you are running OS X 10.6 EverWeb version 2.5.2 is available for you.

When updating to the latest version of EverWeb, the update process will automatically download the correct version of EverWeb for your operating system.

EverWeb 3.3 Includes…

[NEW] You can now search Widgets.

[NEW] You can now search in the New Templates Window.

[NEW] You can now search Web Page List files.

[NEW] The new Page Navigator under the Web Page List lets you easily return to the last page(s) you were working on.

[NEW] Holding down the Option key and expanding a directory in the Web Page List will expand all directories within that directory

[NEW] The Popup window (found in the Hyperlinks Inspector) is now responsive.

[NEW] Selecting an image in a blog post is now reflected in the Assets List.

[NEW] The Image Gallery Lightbox effect when clicked upon is now responsive.

[NEW] You can now duplicate buttons in the Text Section widget.

[NEW] EverWeb can now update multiple widgets of the same type at once from the Inspector->Widget Settings

[NEW] The Contact Form Advanced widget has a new Transparent style.

[NEW] The Contact Form Advanced widget lets you specify the height of the Text Area control.

[NEW] PayPal widget now includes a second Options list

[NEW] Added MYR currency to PayPal widget

[NEW] Visual modifications to all select asset buttons. You now see the name of the selected asset.

[IMPROVED] The Color button in the Toolbar now behaves differently based on what is selected e.g. If a shape is selected, using the Color Picker will change the background color. If a TextBox is selected, using the color picker will will change the text color.

[IMPROVED] Pagination in the Image Gallery widget and blog archive will scroll to the top when used to change page.

[IMPROVED] All Youtube videos are https now.

[IMPROVED] Styled Text Editor in the Inspector will get a default height if none is specified in a widget.

[IMPROVED] Widgets have been optimized helping websites load faster.

[IMPROVED] Widgets should preview much faster when updating settings from the Inspector.

[IMPROVED] Faster code to update Widgets from the Inspector.

[IMPROVED] Improved Page and Browser Background drawing so it is much faster in the Editor Window. Tiled images should be faster so dragging objects within the design canvas will be faster.

[IMPROVED] Image Slider has had its code updated

[IMPROVED] Typing in the Blog Post Editor should now be faster

[IMPROVED] The Blinking caret in text objects new as a slight shadow added to it so that it is easier to see when used with dark backgrounds

[IMPROVED] Blog page titles in Google will now show any quoted text in the blog title

[IMPROVED] Improved Contact Form error messages if the user doesn’t have PHP 5.6 on their server.

[IMPROVED] The Ruler now looks more like that of Apple Keynote.

[FIX] The Page Layout label for Responsive Page Layout was incorrectly labelled as Dynamic Width in some languages.

]FIX] Fixed some FTP publishing issues.

[FIX] Minor bug fixes for the Contact Form Advanced widget and the Image Gallery widget.

[FIX] The required field for the Contact Form Advanced widget’s checkbox and radio button controls now works.

[FIX] Fixed an issue where rulers could cover the Design Canvas

[FIX] Some Theme Templates that use the Image Gallery and some of EverWeb’s other widgets would not load properly. The Theme Template now loads properly when adding a new Theme Template page.

[FIX] The Page Background-> Image ->Scale to Fit on mobile phones now works in the same way as on desktop devices.

[FIX] Fixed issues with full width objects within the Responsive Row Widget.

[FIX] Image gallery popup windows now appear above the navigation bar

[FIX] The Image Gallery widget will now drag properly from the ‘move’ icon in the upper right hand corner

[FIX] Shapes in the Footer Section that are aligned with the Footer top in Master Pages were not getting exported to the Footer

[FIX] Fixed an issue with copying text with links whose anchor text contains fancy quotes ‘’ or “”.

[FIX] Fixed pasting of text into a Widget’s Styled Text Editor.

[FIX] Using the Test Connection button then closing the EW Window no longer shows an error saying something is publishing.

[FIX] Copying text that has hyperlinks in it from other sources such as iWeb or your browser won’t extend the hyperlink for the entire paragraph.

[FIX] Some Contact Form inspector issues fixed, specifically with the Text Area control

[FIX] Images that did not have a retina version may have drawn differently in previous versions of EverWeb. Images now draw exactly the same in EverWeb as they do when you publish your site to a browser.

[FIX] Opening projects built on a retina machine and bringing them to a non-retina machine or vice versa works better now and loads any widget much faster.

How To Update To EverWeb 3.3

You can easily update EverWeb by either:

1. Launching EverWeb then going to the EverWeb menu at the top of the screen and selecting ‘Check for Update’ or by
2. Downloading EverWeb from the EverWeb website.

After downloading EverWeb, double click on the EVERWEB.DMG file. A window will open. Drag the EverWeb icon on to the Applications folder icon. Once the file has been copied, you can close the installation window, delete the .DMG file and eject the EverWeb disk on the desktop by dragging it to the Trashcan.

Remember, you won’t lose any previous data when updating as your website project files are stored elsewhere on your computer.

The update is free for EverWeb + Hosting users and EverWeb Standalone users who are within their 1 year of free upgrades and support period.

You can easily check your EverWeb Standalone free update period from EverWeb’s Preferences window or from your client area.

If you have passed your one year of free EverWeb updates, you can purchase 1 more year of upgrades and support from your client area.

You can easily re-download earlier versions of EverWeb from your client area if you are not ready to purchase an additional year of updates and support.

Login to your client area and go to the ‘Manage Product’ page. On the left of this page, select ‘Downloads’ and choose the version of EverWeb that you need.

More Information About EverWeb

For more information about the new version of EverWeb, please check out the following resources:

• The EverWeb website which has up to the moment information in it’s new blogging section
• New EverWeb videos on YouTube
• The EverWeb User Manual in EverWeb’s Help-> User Manual menu
• The EverWeb Discussion Forum

If you can’t find what you need, or have any other questions, comments or feedback please let us know. We’re happy to help.

The Responsive Row widget is a key resource for anyone building a responsive website in EverWeb. The full width widget is like a ‘bucket’ in that you can drag and drop other widgets, TextBoxes, shapes and images in to it. This is ideal for situations where you want to use widgets that are not full width capable, such as the PayPal widget, or when you want to combine different objects together in one row.

When the Responsive Row widget debuted in EverWeb 2.8, it was easy to see the widget as ubiquitous. However, since its inception, responsive website building in EverWeb itself has evolved as its feature set has expanded as have many of EverWeb’s widgets capabilities. So, is the Responsive Row widget still the Swiss army knife of responsive web design in EverWeb that it used to be? That is a difficult question to answer. Looking back over some of my early responsive website designs has given me some insight in to how things have changed and how it is possible to update already built websites to be more code efficient and easier to manage and maintain. Additionally, this new knowledge is also advantageous when building new websites as you will be able to do this more efficiently, creatively and in less time than before.

Where The Responsive Row Widget May No Longer Be Necessary…

Since EverWeb 2.8 there have been many feature additions and updates to EverWeb that make the reliance on the Responsive Row widget less than when it was introduced. Here are common things that we used to do, but can now do in a better way!

• Navigation Menu Widget

When supporting customers we often find that the Navigation Menu widget has been placed inside of a Responsive Row widget when it does not need to be. If you want full width navigation, just drag and drop the Navigation Menu widget on to your responsive page. It will automatically be a full width object on the page so will automatically scale to the size of the page. Use the Responsive section of the Widget Settings to set responsive specific options for the navigation.

• Background Colors

Initially, EverWeb’s full width widgets did not have the capability of a background fill color (except for the Navigation Menu widget) or image so had to be placed within a Responsive Row widget. That changed in EverWeb 3.0 so now you can add the full width widget of your choice and set its background color or image using the Shape Option tab’s Fill options.

• Combining Objects

When starting out with responsive design, one of the most common things that many users want is to combine text with images. It is easy to use a Responsive Row widget to do this. Just add a Responsive Row widget to the page then add TextBox and images in to it. This is a perfectly valid solution, however, you will need to make sure that your text and images are narrow enough to fit on all devices. The smallest iPhone, for example, is the iPhone SE which has a width of 320 pixels. If you have set margins on your page, then you may find that you only have a usable page width of about 280 pixels. This is fine for an iPhone SE but on a desktop computer you may have a lot of white space on either side of your text and images.

A better alternative may be to use a FlexBox widget instead. You can add the image and text as separate embedded objects. This will enable you to set each object’s minimum and maximum width so that they scale properly on all devices. No more problems with too much white space and scaling issues. Use the Spacing option to add spacing between each embedded object. This option also pads the objects in the widget so you have less need to add margins.

• Margins

Often a Responsive Row widget is used to add top and bottom margins to objects when it is actually not necessary. Here are a couple of examples:

The Navigation Menu widget: This widget has padding and spacing options in its Widget Settings to help frame the navigation properly within the widget. You can also set the background color of the widget too by checking the ‘Use Background Color’ option.

Text Boxes: It is easy to use the enter key to add a top and bottom margin to your full width text, but it is not always necessary. Instead, delete these extra carriage returns and go to the Text Inspector. Use the Insert Margin option to create top and bottom padding as needed.

• Widget Alternatives

Sometimes you may find that you have to experiment a little to get the right solution e.g. when using a combination of text, images and buttons should you be looking at the FlexBox or Text Section widget? you may need to experiment to find out!

When reviewing one of my first responsive websites I found that I had used a Responsive Row widget with four images all of the same size embedded in it. I suddenly thought that I could, in fact, use the Responsive Image Gallery instead. I set the background color of the widget and my added in my images which now scale to any device instead of being stuck at 200px x 200px. The Gallery Padding option added an all round margin and the minimum and maximum width options ensures that the images always size and scale correctly without a lot of white space showing on larger devices!

When You Should Use The Responsive Row Widget

There are, of course, times when the Responsive Row widget is still going to be the ideal choice! For example, when using Fixed Width widgets such as the PayPal, Audio and FaceBook widgets, or when placing social media buttons on your page.

The Responsive Row widget is also a must if you are using EverWeb’s Show on Device feature or when you need to combine objects in to one row in a way that precludes the use of either the FlexBox and Text Section widgets.

There may also be times when the best way to create padding, or a margin, on your page is to use the Responsive Row. You may even find that there are times when using Set Shape as Scroll Position is more beneficial in a Responsive Row widget than in another object.

There are many ways in which you can forego using the Responsive Row widget. Doing so can make your web page easier to manage, more streamlined and less prone to faults and mistakes. However, with web design there is usually more than one answer to overcoming design issues, it’s just knowing where to look, a bit of experimenting and some out of the box thinking!

EverWeb on Social Media

You can also find EverWeb on the following social media platforms:

Facebook

Flipboard

YouTube

Twitter

Instagram