Archive for the 'EverWeb' Category

Easily Copy Pages Between EverWeb Project Files!

Thursday, August 22nd, 2024

One of our most requested feature requests for EverWeb has come to fruition in EverWeb 4.2: The ability to copy pages between project files!

If you are developing more than one website, you may want to copy pages from one, or more, existing project files for use in a new project. This saves you both time and effort as you can recycle your work and be more time efficient as well.

In this blog post we will be looking at copy pages, folders Master pages and objects between project files.

Copying Pages Between EverWeb Project Files

EverWeb 4.2 introduces the ability to easily copy pages between project files. To copy a regular page between project files, first open the project files that you want to use. In this post, we will refer to one project file as the ‘source’ i.e. the project which contains the page that you want to copy, and the other project file as the ‘target’, i.e. the project file that will receive the copied page.

We recommend that you open the target project file first, then the source project file. This will make it easier for copying the page from one to the other as the source project will ‘float’ above the target project on your computer screen.

After opening your project files, position the source and target project files on screen so that you can see both project file’s Web Page List. Now simply drag the page you want from the source project in to the Web Page List of the target project. You may need to wait a moment before you see that the page has been copied over.

If EverWeb encounters any problems, or issues, when copying a page from one project file to another, a dialog box will appear informing you how to proceed. The most common issue that you may come across is if the page name in the source project already exists in the target project. In this instance, the page will not be copied across, so before you copy the page over check that you do not have a duplicate page name in your target project. If you do, rename that particular page in the target project to something else.

Copying Folders Between Project Files

In addition to copying regular pages from one project file to another, you can also copy directories from one project file to another in exactly the same way as you do for copying pages. If you have many pages within the directory, it may take a few moments for the copying to complete.

Copying Master Pages Between Project Files

Master pages are another type of page that can be copied from one project to another. Once you have your source and target project files open, go to the source project file that contains the Master page that you want to copy. Drag and drop the Master page that you want to copy from the Master Page section of the Web Page List in to the regular page section. This will create a copy of the Master Page in the regular page section. Next, drag and drop the Master page ‘copy’ from the regular page list in to the Master page section of the target project file. Once you have completed the copy, delete the Master page ‘copy’ from the regular page section of the Web Page List in the source project file.

Copying Objects Between Project Files

EverWeb 4.2 also allows you to easily copy and paste objects such as widgets, TextBoxes or images, from one project to another. The easiest way to do this is to first select the object you want to copy in the source project file. Next, either use the Edit-> Copy menu option, or the Command+C shortcut key on a Mac, or the Ctril+C keyboard shortcut in Windows to copy the object to the Clipboard. Once the object has been copied, go to the target project file and use the Edit-> Paste menu option, or Command+V (Mac) or Ctrl+V (Windows) shortcut key to paste the object in to the page that you want it added to.

EverWeb 4.2 makes copying pages and objects between project files easy saving you time and effort! if you have a question about this post, or about anything EverWeb related, please let us know. We are here to help!

EverWeb on Social Media

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

Facebook

Flipboard

YouTube

X

Instagram

EverWeb and Contact Forms: An Overview

Friday, August 9th, 2024
EverWeb's Contyact Form Advanced Widget Explained

Almost all websites today include some way in which you can make contact with the company, or individual, behind the website. Typically, websites use tools such as a contact form, and website builders such as EverWeb usually include tools to help you create your own contact form.

When we think about a contact form, inevitably two types of form come to mind, a newsletter sign up form and a contact, or feedback, type of form. However, there are plenty of other forms that you create using EverWeb such as a survey form, support form, evaluation forms, job interview forms and so on.

Why Your Website Should Include a Contact Form

A contact form can be a vital component of a well-designed website. It not only improves user experience and protects you from spam but also helps you gather essential information, manage inquiries efficiently, and can enhance your professional image. By making it easy for visitors to reach out, you can foster better engagement, collect valuable feedback, and ultimately drive more conversions. Whether you run a small business, a blog, or a website for hobby or non-profit reasons, a contact form can prove to be indispensable for effective communication and customer service.

Creating a Contact Form in EverWeb

EverWeb has always included a contact form generator, starting with the Contact Form widget in EverWeb version 1.0. When EverWeb 2.0 debuted, the Contact Form Advanced widget was introduced superseding the original Contact Form widget which remains mainly for legacy reasons.

We recommend using the Contact Form Advanced widget for a number of reasons:

  • It is more secure than the Contact Form widget
  • It is less liable to spam and include tools such as Google’s reCaptcha
  • It has a wide variety of features and functionality enabling you to create the contact form you want for your site.
  • It has the option to add the Contact Forms Enhanced Addon which helps manage your contact form submissions in one place whilst offering enhanced features such as file submissions.

Creating a contact form in your site is easy, just click on the Widgets tab in the Inspector Window then drag and drop the Contact Form Advanced widget to where you want it on your page.

Do You Need EverWeb’s Contact Forms Enhanced Addon?

You will want to use EverWeb’s Contact Forms Enhanced Addon if you want a tool to manage the contact information from the contact forms your website visitors have submitted to you via the Contact Form Advanced widget.

Contact data is stored securely in your EverWeb Client Area where it is easily accessible and can be downloaded to a CSV ?le. The stored email addresses gathered from your contact forms can be used to create mailings to existing and potential new customers, newsletter email lists, surveys, promotions and so on. You can also target speci?c groups or market segments based on questions you ask in your contact form.

Other Contact Forms Enhanced Addon features include:

  • Calendaring features can be added to your Contact Form using the ‘Calendar’ control. The calendar is fully responsive so is perfect for mobile phones, tablets and desktop computers.
  • The ‘Select Time’ control lets displays a popup window to select speci?c times.
  • Visitors can upload ?les to the EverWeb servers. You can then download the ?les safely at a later time from your EverWeb Client Area.

If you require any of these features then you should be using the Contact Forms Enhanced Addon in conjunction with the Contact Form Advanced widget. Just follow the link above to sign up.

Contact Form Advanced Widget Features

When you first look at the Contact Form Advanced widget’s Widget Settings it may seem a little daunting as there are so many features included. The good news is that the widget is broken down in to sections making it easier for you to navigate.

The first section includes basic information required about the contact form, such as the name you want to call it, the email address where your form submissions will be sent to and a field to add in the Contact Forms Enhanced Addon if you have purchased this. The last field in this section is ‘Mail Sending’ which offers you three choices: EverWeb, PHP Mail and SMTP Details. If you choose EverWeb, you will need to have purchased the Contact Forms Enhanced Addon.

The second section is ‘SMTP Details’. Depending on your Mail Sending choice, you may, or may not, need to complete the SMTP Details section. For help with this section, click on the ‘More HHelp’ button.

The third section of the widget is the ‘Form Submission Settings’ section. This is where you define the title of the email subject, where you define the message you give the user once they have submitted their form, where to forward the visitor next, after the form has been submitted and lastly the style of form you want displayed on the page. You can choose between Classic, Modern and Transparent.

After the Form Submission Settings you will see the next section Form Controls. This is the section where you add and manage the fields that you want in your form. By default, three form controls are included when you add the Contact Form Advanced widget to your page. Below the form controls, is the Control Type which is where you define the function of the field e.g. click on the Name Form Control. You will see its Control Type is set to TextBox. You can change this to another type as desired. Below the Control Type are a number of different options to set up the initial parameters for the control, help text and tips as well as styling options.

The next section ‘SPAM Protection’ does just that, it helps your contact form against potential spamming. To activate this section you will need to sign up to Google’s reCaptcha feature which can be easily done by clicking on the ‘Sign Up for reCaptacha v2’ button. Note that if you want to use the widget’s Confirmation Email Settings section which is further down the Widget Settings, you will need to sign up for reCaptcha to use this feature.

The next section, Fonts & Styles, is again important for the styling of your Form Controls so that your form matches with the style of your page and site properly!

The Contact Form Advanced widget also lets you define how you want the Submit button to look. You can even set your own image as well if you want. The next section is concerned with Form Error Validation. This can be of great help when the person submitting the form has not completed the form correctly and tries to submit the form. Usually the default text is good enough, but of course you can change this as required.

The last main section of the Widget Settings is the Confirmation Email Settings section. As mentioned about, you need to enable reCaptcha for this section to work. This section is used to email the form submitter that their form has been received. Again you can customize this as you want.

EverWeb’s Contact Form Advanced widget offers a lot of potential for your website. We will shortly be uploading blog and video content about what you can achieve with the widget, starting off soon with creating a Newsletter Sign Up style Contact Form.

If you have a question about this blog post or about anything EverWeb, please let us know in the Comments Section below.

Getting Started with EverWeb’s NEW Map Fill for More Map Options Than Ever!

Thursday, July 25th, 2024

The new Shape Options Map Fill feature, introduced in EverWeb 4.2, gives you more options and control than ever before for any Google Maps that you may want displayed in your website. In addition to EverWeb‘s existing Google Maps widget, you now have map fill options available from the Shape Options tab.

Google Maps Widget or Shape Options Map Fill?

From EverWeb 4.2 onwards, you now have two ways of adding a map to your website: The Google Maps widget and the Shap Options tab’s Map Fill option. The Google Maps widget was introduced in EverWeb 1.0 and offers you a simple Roadmap view displayed in your website. Just enter an address in the Address field of the widget’s Widget Settings and you will see the resulting map in the Editor Window.

Now in EverWeb 4.2 you can now choose to fill a shape object with a map instead. Using the new Shape Options Map Fill gives you three different levels of map features.

If you only require a simple map with no extra features, you can use either the Google Maps widget or the Shape Options tab’s Simple Map (Deprecated) feature. They both use the same Roadmap feature. If your map requirements require more options and flexibility, you should choose either the Shape Options Map Fill Basic Map (Free) or Advanced Map option

Starting With the Shape Options Map Fill

To use EverWeb’s Map Fill feature, first

  1. Go to the page where you want to add the map, or create a new page, in your site
  2. Click on the Shape button in the Toolbar and select a shape. Note that when using the Map Fill option, whatever shape you have chosen here will be converted in to a rectangular shape in order to display the map.
  3. Click on the Shape Options tab in the Inspector Window
  4. In the Fill section, click on the dropdown menu and choose ‘Map’ from the menu.
  5. You now see a notice informing you that you will need to use a Google API Key in order to access the available map Basic Map (Free) and Advanced Map features.
  6. Choose to either ‘Get Google API Key…’ or ‘Got It’ if you already have an API Key, or want to set this up later. We will discuss getting a Google API Key later on in this blog post.

Map Fill Choices

When it comes to using EverWeb’s new Map Fill feature you have three different levels of map integration to choose from:

  1. Simple Map (Deprecated)
  2. Basic Map (Free)
  3. Advanced Map

The first level, Simple Map (Deprecated), offers the same Roadmap map display as found in EverWeb’s Google Maps widget. Just enter the address that you want in the Location field and the map will be displayed in the Editor Window. The one difference between using the Google Maps widget and the Shape Options feature is that the latter allows you to set a zoom level for the displayed map in the Editor Window.

The second Map Fill option is the Basic Map (Free) option. This option requires that you complete the Google Maps API Key field in order to use its features (see below). This map option allows you to select either a Roadmap view or a Satellite view. In Roadmap view, you can toggle Terrain and Labels on or off, whilst in Satellite view you have the option only to toggle Labels.

Google Maps Cloud Platform and API Keys

When you use the new Map Fill option in EverWeb 4.2 or higher, you will need to include an “API Key code” if you want to use the Basic (Free) or Advanced Map features.

Once you have generated the necessary Key you will then enter it in to the Map Fill ‘Google Maps API Key’ field.

Generating the Google Maps API Key is easy because when you select the Basic or Advanced Map option, EverWeb will display a dialog box with an option to ‘Get Google Maps API Key’.

When you click on this option, you will be taken in to Google Cloud Platform which will then step you through generating a Maps API Key that you can use in EverWeb.

In order to generate a Google Maps API Key, you will required to complete the following steps:

• Create a Google account if you do not have one already, then add Google Cloud Platform to your account.

• If you already have a Google account, you may be asked to log in. Once logged in you may be asked to add Google Cloud Platform to your account.

• You may also be asked to supply billing details to Google. If you are using the Basic (Free) option in EverWeb, you will not be billed. If you are using the Advanced Maps option, you will be charged by Google for using the Advanced Map features.

• You will need to create a Google Could Platform Project, if you have not already created one.

• You will need to make sure that you enable Google Maps Platform APIs and SDKs for your Google Cloud Platform project.

Once you have completed the steps required by Google to generate a Google Maps API Key, copy the API Key to the Clipboard and paste it in to the Google Maps API Key field in the Map Fill section in EverWeb.

Next Steps…

Now that you have added your Map Fill object to your page in conjunction with generating a Google Maps API Key, you can now explore Map Fill’s options as explained in our “EverWeb’s Shape Options Map Fill Feature Set Explained!” post.

if you have any comments on this post, please let us know in the Comments Section below!


EverWeb on Social Media

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

Facebook

Flipboard

YouTube

X

Instagram

EverWeb’s Shape Options Map Fill Feature Set Explained!

Thursday, July 11th, 2024
EverWeb's Shape Options Map Fill Feature

In our last blog post we looked at how to set up your EverWeb project file so that you could use the new Shape Options Map Fill feature that debuted recently in EverWeb 4.2. In this blog post, we will take a closer look at all of the features that are available to you with Map Fill.

To begin, make sure that you have already followed the steps in our previous blog and have a Google Maps API Key Code if you intend to use either the Basic Map (Free) or the Advanced Map option. If you are using the Simple Map (Depreciated) option you will not need a Google Maps API Key.

If you cannot find your Google Maps API Key code, follow the steps below…

Finding Your Google Maps API Key Code

  1. Start by going to google.com in your browser, and sign in to your Google account using the ‘Sign In’ button on the left hand side of the browser window.
  2. Once you have logged in to your Google Account, go in to EverWeb and add a map to your page if you have not done so already. If you have already added a map to your page, select it.
  3. After adding or selecting your Map Fill shape, click on the Key symbol in the object’s Shape Options tab.
  4. You will be taken to your Google Cloud account’s Welcome screen.
  5. In the Quick Access section, click on the ‘APIs and Services’ button.
  6. On the following page, click on the ‘Credentials’ option on the left hand side of the screen.
  7. On the next screen, you will see a section for API Keys. Your Google Maps API key should be listed. Double click on the Google Maps API Key.
  8. On the following screen you can now copy the API Key to the Clipboard.
  9. After copying the API Key to the Clipboard, go back in to EverWeb finish by pasting the key in to the Google Maps API Key field.

Map Fill Features

After you have entered your Google Maps API Key, you can begin to use Map Fill’s features.

If you are using the ‘Basic (Deprecated)’ map type, you will not have any additional features available. except for the ability to set the Zoom level of the map. You can set a value of zoom between 0 and 21 using the slider or the increment control, or by entering in the Zoom number that you want in the field.

The second map type, the Basic Map (Free), type gives you the following options in addition to those offered by the Simple Map (Deprecated) type.

Roadmap or Satellite Display: You have a choice of either a Roadmap view or a Satellite map view.

Show or Hide Terrain and Labels: If you choose Satellite View you can select to show Terrain and Labels. If you choose the Roadmap view, you will only be able to choose to show or Hide Labels.

The last map available map type Advanced Map. This is a paid for option from Google. This map type includes all of the features of the Simple (Deprecated) and Basic (Free) map types and has the following additional features:

Show Controls: Choose to show or hide whether users can use map Controls or not.

Ignore Mouse Gestures: You can choose to let your users use mouse gestures on the map, or not.

Always Show Label On Marker: Choose whether to show or hide this feature.

Add your own labels: You also have the ability to include your own labels to your map

Summary

EverWeb’s new Map Fill feature allows you to choose whichever level of map features suits your website’s needs.

EverWeb 4.2.1 Maintenance & Stability Release Now Available!

Saturday, July 6th, 2024
EverWeb 4.2.1 Maintenance and Stability Release Out Now

A new maintenance release of EverWeb for Windows and macOS is now available. If you are currently running EverWeb 4.2, we recommend that you update your version to the new 4.2.1 version.

EverWeb 4.2.1 is a free update for both EverWeb + Hosting users and EverWeb Standalone users with active Support & Update plans. 

Which Version of EverWeb Is For You?

EverWeb 4.2.1 is available in the following versions:

  • If you are running Microsoft Windows 10 or 11.
  • If you are running an Intel Mac running macOS High Sierra, Mojave, Catalina, Big Sur, Monterey, Ventura or Sonoma.
  • If you are running an Apple Silicon Mac running macOS Ventura, Monterey, Big Sur or Sonoma. As EverWeb is a Universal Binary it will run natively without the need to use Rosetta 2.

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

Fixed and Improved In EverWeb 4.2.1

  • [IMPROVED] Improved support for re-arranging FlexBox objects
  • [IMPROVED] Better parsing of Vimeo link urls
  • [IMPROVED] Removed the ‘Max Size’ for Shapes
  • [FIXED] The Text Style name was not appearing in the Paragraph Styles dropdown menu. Fixed!
  • [FIXED] The SEO suggestion for the number of keywords
  • [FIXED] Issues with shadows for certain objects
  • [FIXED] An issue with ‘Insert Fixed Scroll Position ‘
  • [FIXED] An issue with Dividers on FireFox and on mobile devices

How To Update To EverWeb for Windows

You can easily update EverWeb for Windows by either:

  1. Launching EverWeb then opening a project file. From the Help menu at the top of the screen select ‘Check for Update’ or by
  2. Downloading EverWeb from the EverWeb website.
  3. Downloading EverWeb from the Support-> Downloads section of the EverWeb Client Area.

After downloading EverWeb, double click on the EverWebSetup.exe file. Note that the file name may have the version number appended to it and that you may need to initially trust the file to be able to download it.

Follow the instructions in the Installation Wizard until the installation is finished. You can delete the EverWebSetup.exe file afterwards by dragging it to the Recycle Bin.

How To Update To EverWeb for macOS

You can easily update EverWeb for macOS 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.
  3. Downloading EverWeb from the Support-> Downloads section of the EverWeb Client Area.

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 

About Your EverWeb Update

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 update period from your EverWeb-> Preferences… window on macOS, your Edit-> Options menu on Windows 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 its blogging section
  • New EverWeb videos on YouTube
  • The EverWeb User Manual in EverWeb’s Help-> User Manual menu on macOS or Help-> User Manual menu on MS Windows
  • The EverWeb Discussion Forum

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

EverWeb on Social Media

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

Facebook

Flipboard

YouTube

X

Instagram

New Responsive Row Widget Options Come to EverWeb 4.2

Thursday, June 27th, 2024
EverWeb 4.2's New Responsive Row Toolbar features

One of the major goals of EverWeb is to always make building your website as simple and as easy as possible. With this in mind, our latest release, EverWeb 4.2, has added some great new ways of working with the Responsive Row widget that should save you both time and effort!

New UI Tools for The Responsive Row Widget

The Responsive Row widget has been updated to include a Toolbar that runs across the top of the widget. You will see the Responsive Row Toolbar whenever you select the widget. The name of the Responsive Row is now displayed in the middle of the Toolbar, whereas in previous versions of EverWeb it was displayed in the top left hand corner of the widget. There are five icons in the Responsive Row’s Toolbar:

  • Up Arrow – Click on the Up Arrow symbol to move the Responsive Row up the page.
  • Down Arrow – Click on the Down Arrow symbol to move the Responsive Row down the page.
  • Trash Can – This icon deletes all of the embedded objects that are currently in the selected Responsive Row, if there no objects embedded in the Responsive Row, then pressing the Trashcan icon will delete the Responsive Row itself. If you have deleted embedded objects, or the Responsive Row itself by mistake, use the Edit-> Undo (Command-X on Mac, Control+X on Windows) command tp restore the objects.
  • Settings Cog – Use this icon to access the Responsive Row’s widget settings without having to mouse over to the Widget Settings tab. This is a great way to help you work more efficiently.
  • Move Icon – Click and drag on this three line icon in the right hand side of the Responsive Row Toolbar then drag and drop the widget up or down to where you want it placed.

Additional Ways of Moving the Responsive Row Widget

The new Responsive Row Toolbar lets you move the currently selected widget up or down the page using the up/down arrows or by using the Move icon located on the right hand side of the Toolbar. In addition, you can also just click and hold the cursor on the any empty part of the Toolbar itself and drag it up and down the page as desired. Release the mouse when the widget is positioned where you want it on the page.

Hiding The Responsive Row Toolbar

If you do not want to see the Responsive Row’s Toolbar icons use the Window-> Hide Layout menu option. When you select this option the complete page layout will be hidden as well as all of the in-situ icons. Only the currently selected object will display the ‘in-situ’ icons. to restore the page layout features, just toggle the Window-> Show Layout menu option.

EverWeb 4.2’s new UI features help make designing and customizing objects and widgets, such as the Responsive Row widget, even easier and quicker than ever! We hope you enjoy this new feature and if you have any comments, please let us know below.

EverWeb on Social Media

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

Facebook

Flipboard

YouTube

X

Instagram

EverWeb’s New Video Fill Feature For Flexible Video Placement on Your Web Pages!

Thursday, June 13th, 2024

The newly released EverWeb version 4.2 for macOS and Windows includes two new features for EverWeb‘s Shape Options tab: Map Fill and Video Fill. These two new options give you more ways than ever in which you can integrate maps and videos in to your website. In this post, we will be looking at Video Fill. We will cover Map Fill in a later blog post.

Adding Video To Your Website’s Pages

EverWeb has a number of different ways in which you can add video to your website’s pages

  1. As a Browser Background: Use the Inspector Window’s Page Settings-> Browser Background setting to set a video background for your page’s Browser Window
  2. Using a dedicated widget. EverWeb has three dedicated video themed widgets: The Video widget can be used with MP4 files and for legacy video formats such as WebM and OGG files. The YouTube Widget is used with YouTube videos and the Vimeo Widget with Vimeo videos.
  3. By embedding a video within the FlexBox Widget. The FlexBox widget is unique in that you can use it to embed a video within it.
  4. The last way to add video to your website’s page is available if you are using EverWeb 4.2 or higher is by using Video Fill. You can use this option on most objects on your page. Alternatively, you can drag and drop a video directly from its source location, such as your computer desktop or the Cloud, on to your page. This will also create a Video Fill object.

In this post we will be looking at the last of these options, Video Fill, that was introduced in EverWeb 4.2.

Why Use Video Fill?

The new Video Fill feature can be applied to most objects, for example, a shape or TextBox. When used in this way, the object itself will become a video fill shape instead of its original object type. For example, if you add a shape in the form of a star to your page, then set the star shape to Video Fill using the Shape Options-> Fill option, the original star shape will be replaced with the video fill shape.

In this way, you have now more flexibility when adding video to your page. Also, the Video Fill options offer you a wider range of customization choices than those offered by EverWeb’s default widgets. You, therefore, have more options and choice on how to use video on your pages than ever before.

Using Shape Options’ Video Fill

As mentioned above, to use Video Fill, simply add an object to your page, such as a shape, or TextBox, then go to the Shape Options tab in the Inspector Window. Click on the Fill type dropdown menu and select Video Fill from the available options. The selected object will become a Video Fill object.

Alternatively, you can also drag and drop a video file from your hard disk, or Cloud location, on to your page and it will be automatically converted to a Video Fill object.

Video Fill’s Video Source

If you have added an object to the page, then converted it to a Video Fill object, the first thing you will need to do is to link the object to a video file. To do this, use the Video Source dropdown menu immediately below the Fill dropdown menu, You have four options to choose from:

  • External Video URL
  • Local Video File (i.e. a video file stored in the project file)
  • YouTube Video File
  • Vimeo Video File

Once you have chosen the Video source and linked it appropriately, you can then customize the Video Fill.

Customizing Your Video Fill

All of the Video Sources have the options to

  • Loop the video,
  • Auto Play the video,
  • Mute the video,
  • Show Video Controls
  • Set the default volume level and
  • Set the scroll speed of the video.

If you are using the External Video URL, or Local Video File as your Video Source, you have three additional options available. The first option enables you to scale you video to either ‘Scale to Fit’, ‘Scale to Fill’. ‘Stretch’ or use the video at its ‘Original Size’. Choose the option that is most appropriate to your video.

The second option is to add a Thumbnail to your video. This is like having a cover image for the video that the user has to click on in order to view the video. Using a thumbnail image is also useful if your video is large and takes time to load on the page.

The last additional option is ‘Pause other videos on play’ which does exactly what it says. This is a useful option to check when you have more than one video on your page.

EverWeb’s new Video Fill option makes adding videos to your pages easier, with more customizations options available than ever!

EverWeb on Social Media

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

Facebook

Flipboard

YouTube

X

Instagram

What’s NEW In EverWeb 4.2: New In-Situ Widget Settings, Responsive Row Toolbar and More!

Wednesday, June 5th, 2024

We are thrilled to announce the immediate release of EverWeb version 4.2 for macOS and Windows. New in this version are a Toolbar for the Responsive Row widget, in-situ widget settings for all widgets, video and map fill options in the Shape Options tab, and much much more. Check out the full list of new and updated features below as well as the usual maintenance and stability updates.

Which Version of EverWeb is for You?

EverWeb is available in the following versions:

  • If you are running Microsoft Windows 10 or 11, EverWeb 4.2 is available for you.
  • If you are running an Intel Mac running macOS High Sierra, Mojave, Catalina, Big Sur, Monterey, Ventura or Sonoma, EverWeb version 4.2 is available for you.
  • If you are running an Apple Silicon Mac running macOS Ventura, Monterey, Big Sur or Sonoma, EverWeb version 4.2 is available for you as a Universal Binary. EverWeb will run natively without the need to use Rosetta 2.
  • If you are running OS X 10.10 – macOS 10.12 (OS X Yosemite, OS X El Capitan, macOS Sierra) EverWeb 3.4.2 is for you.
  • If you are running OS X 10.7 – 10.9 (Lion, Mountain Lion, Mavericks) EverWeb version 2.9.1 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 4.2 Includes…

  • [NEW] Background Video Fill and Map Fill options in the Inspector-> Shape Options-> Fill.
  • [NEW] Shape Options-> Video Fill can be from a URL, a selected video file, YouTube link or Vimeo link.
  • [NEW] Responsive Rows now include a Toolbar with move up, move down, Settings and Delete buttons.
  • [NEW] Responsive Rows can be dragged up or down using the blue Toolbar itself when they are selected.
  • [NEW] You can use the 3 line Move symbol on the right hand side of the Responsive Row Toolbar to move the Responsive Row up or down.
  • [NEW] All widgets have a Settings Cog icon that lets you adjust their settings instead of having to use the Inspector. 
  • [NEW] All Full Width widgets in Responsive pages now include move up and move down arrows.
  • [NEW] You can now drag and drop web pages between projects.
  • [NEW] You can now drag and drop Master Pages between projects.
  • [NEW] You can now copy and paste objects including images between projects.
  • [NEW] Dropping a video on to a page will add a Video Fill shape.
  • [NEW] Shape Options-> Image Fill now has an Alignment option.
  • [NEW] You can now select the jQuery version from Publishing Settings.
  • [NEW] Flexbox Video URL can be a Youtube, Vimeo or MP4 link.
  • [NEW] New Features Tour is now in all supported languages.
  • [IMPROVED] All Help Icon videos in EverWeb now use the latest available videos.
  • [CHANGE] For macOS users, the EverWeb-> Preferences… menu option has been renamed to EverWeb-> Settings…
  • [FIX] A large number of fixes and improvements for EverWeb on Windows.
  • [FIX] SVG files are not exported as WebP files anymore when using the Optimize Images Options.
  • [FIX] Captions work again for the Responsive Image Gallery widget.
  • [FIX] Fixed an issue with dragging objects between Responsive Row Widgets.
  • [FIX] Fixed some issues with importing iWeb image galleries that could crash on Windows.
  • [FIX] Fixed some issues with Copy & Paste To Match Style.
  • [FIX] Fixed some rotation issues and background colors on Windows.
  • [FIX] Fixed some issues with Shape Dividers.
  • [FIX] A line spacing issue where TextBoxes seem to be longer and overlapping when published.
  • [FIX] Fixed some issues where background images would not display properly when published.
  • [FIX] Fixed issue with the blog having to be fully published after making some changes.

How To Update To EverWeb 4.2 for Windows

You can easily update EverWeb for Windows by either:

  1. Launching EverWeb then opening a project file. From the Help menu at the top of the screen select ‘Check for Update’ or by
  2. Downloading EverWeb from the EverWeb website.

After downloading EverWeb, double click on the EverWebSetup.exe file. Note that the file name may have the version number appended to it and that you may need to initially trust the file to be able to download it.

Follow the instructions in the Installation Wizard until the installation is finished. You can delete the EverWebSetup.exe file afterwards by dragging it to the Recycle Bin.

How To Update To EverWeb 4.2 for macOS

You can easily update EverWeb for macOS 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.

About Your EverWeb Update

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 update period from your EverWeb-> Preferences… window on macOS, from your Edit-> Options menu on Window,s 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 its 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.

EverWeb on Social Media

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

Facebook

Flipboard

YouTube

X

Instagram

Learning About Responsive Website Building Through EverWeb’s Theme Templates

Thursday, May 16th, 2024
Responsive Websites and EverWeb Theme Templates

Creating your first website is an exciting experience but it can also be a daunting one for the inexperienced. EverWeb makes designing and building your website as easy as possible, with drag and drop capabilities meaning that you do not have to code to be able to create the site that you want.

Website building is full of choices, and perhaps the most crucial one coming before you begin building your site’s first page. What type of website should you be building? This may seem a strange question if you are completely new to website building. In EverWeb, there are two types of website that you can build. We use the terms ‘fixed width’ and ‘responsive’ to describe these two types of websites.

A Fixed Width type website is a free form type of website where you can drag and drop objects such as images, text, shapes etc. anywhere on your work canvas. You can freely move objects around the page to wherever you want. It is a great way to start if you have never built a website before. The downside to this type of website is that because the pages are ‘fixed width’ you will have to design pages for desktop devices and corresponding pages for mobile devices. So you double your page count and will have to maintain two sets of pages.

The second type of website is ‘Responsive’. The difference between this type of website and a fixed width one is that a responsive site’s design is more structured, rather than free form. Responsive websites also automatically respond to the type of browser their pages are being displayed upon, so you only need one page design and not two. As a result, there should be less maintenance of your site’s pages to do in future, but the design process itself can be more challenging than if you were designing a fixed width site.

Learning Using EverWeb’s Theme Templates

Some EverWeb users start by building a fixed width website then later on redesign their website as a responsive one. This makes sense if you have no website building experience and also if you are new to EverWeb. It also means that you get your site up and running quickly and get more experience with EverWeb at the same time.

When it comes to creating a responsive website, you can use the skills that you have already acquired to create your responsive website. To get familiar with how a responsive website works, you could download one of the responsive theme templates that comes with EverWeb and look at how the theme template has been designed. For example, create a new project from the Projects Window in EverWeb then add the Home page of the Advisor template to the new project. When the page is added to the new project, click and drag the right hand side of the EverWeb app to the left and right. You will see the page change in the Editor Window as you do so. Objects move and change to conform automatically to the width of the page. Notice also that these objects are contained within bands across the page.

Let’s start with the band at the top of the page. This is named ‘Header’. Inside the ‘Header’ are two objects’: A TextBox that contains the word ‘Advisor’ and a Navigation Menu widget. The ‘band’ in which these objects are located within is a Responsive Row widget. As you narrow the width of the EverWeb app, you will notice that the Navigation Menu widget changes from a standard menu structure to a Hamburger menu. Double click on the Navigation Menu widget then scroll down its Widget Settings. You will notice in the Responsive Options section that ‘Responsive Navigation Bar’ has been checked and that it is set to ‘Appear at Width’ of 700 pixels or less.

Next let’s take a look at the third row of the page. This is a TextBox containing the page title (“I’m a Business Advisor” and some subheading text. Note here that the text goes right across the width of the page. When you reduce the width of the page, the text automatically repositions itself so that it always fits the width of the page. Click on this TextBox, then go to the Metrics Inspector. You will see that the ‘Full Width’ box has been checked.

Next let’s move on to the fourth row of the page. In this row you will see a TextBox with ‘Contact Me’ as its text, together with a hyperlink embedded within a Responsive Row widget. Compare this to the full width TextBox above it. In the ‘Contact Me’ row, we do not want the TextBox to be full width. Click on the TextBox then click on the Metrics Inspector. You will see that the TextBox is just 157 pixels wide. This is wide enough to be displayed properly in any browser window on any device. This also gives us our first example of a fixed width object on a responsive page. When designing your own pages, be careful if you have fixed width objects within a Responsive Row widget. The width of the fixed width object should not be too large that it causes the page to scroll to the left and right. As a guide, make fixed width objects only have a maximum width of about 350-400 pixels.

The next row of interest is the Responsive Row containing the image. Click on the image to select it then go to the Shape Options tab. Here you can see that the image has been set up as Scale to Fill. When adding images to your own responsive page, you may need to experiment to see which type of image fill is best to use, as the best option to choose usually depends on the image itself.

Next click on the Metrics Inspector. You will notice that the image is set as a full width object. Also note, though, that the maximum width of the image has been set to 900 pixels wide. In this way, the image will not become too large if you increase the width of the page.

The other interesting point to note about this Responsive Row is that its background colors are blue and white. To see how this has been created, click on the blue-white area to select the Responsive Row itself, then go to the Shape Options tab again. You will see now that the fill is an Advanced Gradient Fill with blue occupying one side of the fill and white on the other.

Under the image, is another Responsive Row widget, this time containing a TextBox on the left hand side, with two Text Section widgets to the right of the TextBox. The TextBox has a width of 375 pixels and each Text Section widget a width of 280 pixels. In this row, the Text Section widget combines text and an image to create an effective display. Note also how all three objects change as you change the width of the page.

The final row we are going to look at is the one directly below the Life Coach Training full width TextBox. This row is in fact a FlexBox widget that contains three Embedded objects. FlexBoxes, like Text Section widgets are very useful tools to use in Responsive page design! Take a look at the FlexBox’s Widget Settings. Note that each text/image embedded object combination has a maximum width of 335 pixels. Again, this means that the object will not be too wide for a mobile phone’s browser which typically is about 400-450 pixels wide.

Conclusion

Using a Theme Template is a great practical way to see how a responsive page has been created. If you create a test website as we did above, you can create safe environment where you can try out using a responsive theme template without any risks. This also give you the freedom to experiment to see what works and what does not work and to get familiar with designing responsive pages before tackling your own website.

Don’t forget to also check out the EverWeb User Manual and our videos on YouTube. If you have a question, you are always welcome to ask us here on this blog, or on the EverWeb User Forum.

EverWeb on Social Media

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

Facebook

Flipboard

YouTube

X

Instagram

Creating Your Membership Sites Pages in EverWeb

Friday, May 3rd, 2024
Creating Membership Site Pages in EverWeb

EverWeb Membership Sites was introduced in EverWeb 4.0 for macOS and Windows giving you the freedom to create your own membership, or subscription service, that seamlessly integrates in to your EverWeb made website.

When you create the pages for your membership site in EverWeb you may suddenly find that you have more pages than you thought would be necessary! So, in this blog post, we are going to look at the essential pages that you need to create for your membership site, and any additional pages that may prove to be useful to you.

Creating Your Membership Sites Directory Structure

The first thing that we recommend you do is to create a folder in your EverWeb Project file in which you place all of your membership site’s pages. In this way you keep everything neat, tidy and together! It is also easy to collapse the folder down when you are working elsewhere in your project.

To create a new folder, simply click on the Add Directory button in the Toolbar. Choose either the Home page of the Blank, or Blank Responsive, Theme Template. Click on ‘Select’ to finish. Next give your newly created directory folder a meaningful name by double clicking on the ‘Home’ directory page that you have just created in the Web Page List on the left hand side of your project. Overtype ‘Home’ with your own name e.g. ‘Membership Site’, then press Enter to finish.

Creating a Membership Sites Master Page

When creating your membership site, you may want to begin by creating a Master page for its pages, or use one of your site’s existing Master pages. This will save you time and effort in designing your membership site’s pages, and will make it easier to update all of your membership site’s pages later on if needed.

The first membership site page that you will probably want to create is a welcome, or ‘home’, page, to direct your members, and potential members, to the appropriate pages in your membership site. For example, if you someone wants to sign up, you could create a sign up button, or hyperlink, that they can click on to go to your membership site’s sign up page. You may also have buttons to take users to their membership content level page via your membership site’s login page.

When you create this landing page, you may want to come back to it later to update hyperlinks after you have created other pages in your membership site.

Adding EverWeb Membership Sites Widgets

When you sign up to EverWeb Membership Sites, you will receive a zip file containing seven specially created widgets to be used exclusively in membership sites. When you receive the widgets pack, copy it to your desktop. Next, go in to EverWeb and click on the Widgets tab in the Inspector Window. Drag and drop the Membership Sites widgets pack on top of the widgets in the Widgets tab. The Membership Sites widgets will be installed. After installation, you can then access the widgets by selecting the folder they have been installed in by using the dropdown menu at the top of the Widgets tab.

Creating the Necessary Pages of Your Membership Site

When creating your membership site’s pages, you will be guided by the special Membership Sites widgets that you received when signing up for an EverWeb Membership Sites plan. The Membership Sites widgets will be described below as we create new membership site pages.

Creating Your Membership Site’s Sign Up Page

After creating your membership site’s landing page, the next page to create is your Sign Up page so that potential members can sign up to your membership site. To do this,

  1. Add a new page to your membership sites folder.
  2. Attach your Master page to the Sign Up page if you have created one already for your membership site.
  3. Use the Master Page field in the Page Settings tab of the Inspector Window to attach your Master page to your Sign Up page.
  4. Style the Sign Up page as desired.
  5. Drag and drop the Membership Sign Up Form widget from the Widgets tab on to the page. If you cannot find this widget in the widgets tab, use the Widget Tab’s Search function to locate it.

After drag and dropping the widget on to the page, notice that the widget in the Editor Window has two instructions included. The first instruction asks you to select your Membership License from the Inspector, the second instruction is to create an additional page for your membership site – a Sign Up Successful page. For the first instruction, click in the ‘Membership Sites’ dropdown menu in the Inspector Window and select your Membership Sites Licence. For the second instruction, create your Sign Up Successful page by using the Add Page button.

Once you have created your Sign Up Successful page, name it e.g. ‘Sign Up Success’, then go back to the Sign Up page. Click on the Sign Up Form widget, then go to the ‘Successful Sign Up’ field in the Widget Settings. Select your Successful Sign Up page from the dropdown list.

Continue to design your Sign Up page in the Editor Window and use the Sign Up Form’s Widget Settings as desired to customize the widget to match your website’s style.

Note that the Widget Settings also allow you to create an additional ‘Terms of Service’ page. Create this page in the same way as you did for the Sign Up Success page.

After completing your Sign Up page, proceed with completing your Sign Up Success and Terms of Service pages.

Creating Your Membership Login Page

After creating your first four membership site pages, the next page that we recommend you create is the Login page for your membership site. Again, create a new page in your membership site’s folder, and style as desired. Once you have completed this, add the Membership Login Form widget to the page. As with the Membership Sign Up Form widget, you will see two red banners across the widget in the Editor Window that tell you the fields that you are obligated to complete. i.e. the link to your membership site license and the creation of Login Success page linked to your Membership Login Form widget’s Login Success field in your Login page.

Membership Profile, Change Password & Payment Forms

After creating your Sign Up and Login pages, you should now have six pages in total. The next three pages, the Membership Profile Form, Change Password Form and Payment Form all require additional Success Pages to be included as well. After creating these six pages in the same way as you did for the Sign Up and Login pages, you will have twelve pages completed.

Using The Membership Sign Out Button

The Membership Sign Out Button should be added to most of your membership site’s pages, with the exception of the Sign Up, Sign Up Success and Login pages. As such, you will probably want to add it to your Master Page so that it is automatically included on your membership site’s pages. When you do this, remember that you will need a second Master page that does not include the button. This second Master page will be used for pages such as the Sign Up, Sign up Success and Login pages.

The Sign Out Button also has a ‘Sign Out Link’ field which you can link to a Sign Out Success page. This, therefore, means that you will need to create an additional ‘Sign Out Success’ page for your membership site.

Additional Required Membership Site Pages

Before launching, or testing your membership site, click on the Membership Sites Settings… button which you can find in most Membership Sites widget’s Widget Settings. This will show you a list of pages that EverWeb Membership Sites requires you to create, and some additional optional pages that you can either create yourself, or let EverWeb manage.

Some of the pages you have already created. These are automatically linked to their corresponding fields in the Membership Sites Settings… dialog box. The page on the required list that you probably have not created is usually Email Verification.

Create the email verification page in the same way that you have for other membership site pages. Once you have created the page, drag and drop the membership Email Verification Button widget on to the page. Once the button is on the page, it will link automatically to the Membership Sites Settings… dialog box.

The other three pages in the dialog box are for Account Suspension, Account Cancellation and Access Denied pages. These are optional pages that you can create if you want to, or you can leave EverWeb to generate default responses.

Creating Your Membership Site’s Content Pages

The last task that you will need to complete is to create your content pages. Each content page should be associated with its relevant Membership Level e.g. if you have free, bronze, silver and gold membership levels, you should create specific pages in your site for each of these membership levels.

In total, you will probably have at least 14 pages in our membership site. This may sound like a daunting task, but the process to create these pages is fairly straightforward and the Membership Sites widgets will help guide you almost intuitively as to what to do next.

Once finished, publish and test your new membership site!

EverWeb on Social Media

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

Facebook

Flipboard

YouTube

X

Instagram