Serif WebPlus

WebPlus X8

Released 17th Nov 2014 • Updated 8th Dec 2015 • Discontinued 6th Jan 2017

CommunityPlus Closure

Serif CommunityPlus has now closed. Alfred has set up a support forum for Serif users.

Serif Legacy Products

Legacy products can now be registered with a Universal Registration Key of 881887

WebPlus X8 is no longer sold by Serif, and is hard to find on E-bay etc. If you do buy it, make sure it is a legal copy with a product key.

Important Announcements: Serif shut down Serif Web Resources on August 31st 2018, and Serif Web-hosting on July 31st 2019. WebPlus won’t stop working — just any objects that rely on Serif Web Resources. I transferred this site, Softerviews.org, to a new web-host. As long as there are some still using WebPlus you can continue to get support on CommunityPlus. I plan to continue using WebPlus X8 for many years yet as it suits my needs well and I have invested many months into my Buddhist websites: aimwell.org (315 pages) and the Dictionary of Pali Proper Names (3,968 pages).

If you need to reinstall WebPlus X8 or WebPlus X7, but don’t have the installer, these can be downloaded from the links on this forum thread. How to obtain your product key.

Due to the success of Affinity Photo and Affinity Designer for the MAC, Serif decided to concentrate their efforts on the Affinity range of products. Serif stated long ago that there would be no version of WebPlus to create responsive web sites, so it comes as no surprise that there won’t now be a WebPlus X9. The wish-list is obsolete, so I have removed it from this page. The older versions of WebPlus are also obsolete so I have merged older content to one section on legacy features.

There will be no Affinity web designer, but Affinity Designer (vector graphics), Affinity Photo (photo-editing and stitching), and Affinity Publisher (desktop publishing) are available for Windows and MacOS.

Ask on the Affinity Forum for road-maps and feature sets.

This is a brief summary of the main new features in the final release of WebPlus:

Audio Player • CSS Magnifying Glass • Custom CSS • Embeddable Fonts • Exclude Page

Manage Online Resources • Pinterest Button • Save as Package • SFTP Upload • Slider Studio

SWR Improvements • Task Monitor • TWAIN/WIA Scanning • Watermarking

Deprecated Features • Conclusions • Legacy Features

Audio Player

An audio player with ten different skins (selected in Site Properties for the entire site) to play common audio files.

CSS Magnifying Glass

Quickly and easily add a magnifying glass to an image for users to zoom in.

Custom CSS

Add a multitude of CSS properties to objects by selecting from a menu.

Embeddable Fonts

Use any installed font that permits embedding to increase the design possibilities, without the need to do any coding with @FontFace or upload any fonts. WebPlus now does all the hard work for you. Just remember the basic principle of “Less is More.” Don’t overload your site with lots of large fonts, or spoil the design due to inconsistent use of typefaces.

I have used a custom font here just to show-case the feature, but I wouldn’t recommend mixing fonts in the same story without good reason, e.g. to show code in a different typeface. I increased the font size from 12 to 14 point to compensate for the smaller x-height of the Mandala font used for this text compared to that for Verdana.

My free OpenType fonts have lots of symbols, e.g. for Chess: ♔♛♖♝♘♟ etc. Using custom fonts in this way greatly extends the versatility of WebPlus for foreign languages or special purposes. For me, this feature alone makes it worth upgrading to WebPlus X8 as I develop my own fonts, and need to use lots of Latin Extended characters on my Buddhist sites. It has long been a problem to use correct spellings and still be sure that site visitors can read the texts without downloading and installing special fonts. Even if one needs to use Burmese, Sinhala, or Thai words, as long as one has a suitable font that supports those character sets, WebPlus will do all of the coding, and upload the fonts automatically.

Exclude Page

Exclude any page from publication if it is not yet ready to publish. Very useful in the design stage, or when reviewing products not yet ready for sale.

Manage Online Resources

Large video files, PDF files, or archives can be uploaded just once unless the linked resource is updated locally.

Pinterest Button

Make it easy for site visitors to bookmark items by adding a Pinterest Button

Save As Package

Save a site project file *.wpp as a package, embedding all linked content and fonts. When opening the package on another PC, you will be asked to choose a folder to which to extract the content. This makes it easy to keep the *.wpp project file as small as possible for quick backup to the server by linking all content, while preserving a copy with all of the content for moving the project to a laptop or someone else’s PC. This current site is just 587 Kbytes as a *.wpp project file, but 168 Mbytes when saved as a package with all of the PDF files, Videos, etc.

SFTP Upload

Secure and encrypted uploading of data and file management on secure servers.

Slider Studio

A dedicated studio for designing sliders.

SWR Improvements

The Serif Web Resources interface was redesigned and improved for easy management of Smart Objects like Forums and Blogs. Note: SWR will cease to function on August 31st 2018 and submission of forms will cease on 1st April 2018. Ask on CommunityPlus for alternative solutions.

Task Monitor

The Task Manager Tab replaces the Site-checker with smart reminders of tasks that need to be done to fix site problems. Users can add their own tasks to create a ToDo list.

TWAIN/WIA Scanning

Improvements to 64-bit scanning already implemented in PagePlus.

Watermarking

Add text or logos to images to watermark them. Users often ask how to protect their images on the Internet. It’s not easy, but adding a watermark with your web site’s URL or company logo makes them rather less useful to others, and may be helpful if you do decide to take legal action. This method is perhaps the most effective solution, but it takes too much work for general use.

I have added a text watermark to the image on the left. It’s easy to change the font, font style, text size, style, colours, drop shadow, position, offset, rotation, etc., or one can use another image as the watermark. Watermarks have no effect on the image that is embedded or linked to the *.wpp file, so they are easily removed. They are combined with the original image on uploading the page to create a new watermarked image.

Deprecated Features

• Hit-counters have been removed. Use Google Analytics. Hits since this update:
• Page Counters have been removed. This site currently has pages.
• Creative Text Frames were removed earlier, now all creative text is output as graphics.
• Serif Web Resources

Conclusions

For me, the benefit of font embedding is the most valuable improvement. My Buddhist sites need Latin Extended Additional characters and I develop my own fonts, so being able to embed fonts easily without writing and testing @fontface code is a huge bonus. The Audio Player also solved problems with playing MP3 files without opening a new tab.

The usual caveats apply when transferring sites from older versions:–

1. Keep the old version installed to maintain old web sites
2. Work on a copy of your websites in the new version
3. Upload the updated site to a test folder before making it live.

Legacy Features

WebPlus X7 improved performance with a 64-bit version, and updated the output code with HTML5 support. Below is a brief summary of some legacy features also found in WebPlus X8.

HTML5 • Startup Assistant • Video Player • Workspace Enhancements • Restore Last Session

Site Preview • Site Structure View • User Interface • WebTree Combo Box • Mobile Redirect

Form Date Picker • Preview in Browser • Publish Site • Page Layout • Working With Text

Tables and Calendars • Inserting Images • Manipulating Images • Photo Galleries • Animations

Smart Objects • Site Search • RSS Feeds/Podcasts

HTML5

Sites published with WPX7 use the latest HTML5 standard, which offers the best compatibility playback with no browser plug-in or media playing software required. You don’t need to learn any code, WebPlus does that for you. Just design your site freely using the many tools provided and the code will be generated for you. Of course, if you do know HTML coding, you can insert code snippets into your site.

Startup Assistant

The feeds-based Startup Assistant helps new users get up and running quicker with video tutorials. The learning page now links directly to Community Plus, Serif’s official Help site.

The news feed keeps you informed about the latest updates and other Serif News such as Patches, and special offers.

The latest announcement is that Serif Web Resources will be closing down on August 31st 2018, after which any Smart Objects will no longer function. Switch to another source to provide forms, forums, etc.

Video Player

Insert videos using the Flowplayer to play MP4 video without users needing to install Flash player. The player uses your own video files, so your site visitors don’t need to see YouTube or Vimeo ads. The player can be customised in many ways to change its size and appearance on your site. However, there is a small banner on the player, which can only be removed by licensing the player.

Workspace Enhancements

Workspaces have been around as long as the Studio Tabs. In previous versions one could save and load customised workspaces to suit different projects. Toolbars and menus could be customised before too, but to backup changes entailed a two-step process of exporting a Windows registry key and copying a file from the %AppData% folder. In WPX7, the toolbars and menus are now saved with the workspace, so the user only needs to copy the relevant *.wtb file from the %AppData%\Workspace Profiles\ folder to an external drive to make a backup. A drop-list on the context toolbar makes it easy to switch workspaces.

Tip: Remember to save any changes made to the toolbars, menus, or studio tab layout to a workspace file before selecting another one.

Restore Last Session

This is a great time-saver. On starting WebPlus you can now have it load the site or sites you were last working on, display the page you were working on, and resume just where you left off, already zoomed in to fit the page width, or however you prefer to work. See Options, General, On Startup.

Site Preview

When you preview your site in any browser, there is no longer any choice between previewing the current page or the whole site. The current page is previewed automatically, and other pages are generated as and when they are needed if you browse from the current page. This is also a huge time-saver. Instead of having to return to WebPlus, and navigate the site to preview a different page, you just navigate in your browser. If the page is long and complex it make take a few seconds to be generated, but you never have to generate the entire site to preview all pages as in earlier versions.

Site Structure View

This view gives an overview of the entire site structure as a tree, and allows pruning and grafting of pages and their child pages to another branch of the tree.

Although it is more user-friendly than the Site Tab, it is far less useful for restructuring a web site than the outline view that the Site Tab provides. Unless your site is less than 10-20 pages it won’t fit the window at a size big enough to read the page titles. NetObjects Fusion does it much better.

The screen shot shows the Structure View of the current site, for which 14 out of 28 site pages will fit my 1920 x 1080 monitor at a size large enough to tell which page is which from the Titles or page previews.

User Interface

WebPlus has medium (18 pix) and large (24 pix) icons for those with large monitors or less than perfect eyesight. A new Colour Toolbar makes it easier to apply fill, line, and text colours, and a Studio Toolbar gives quick access to your favourite studio tabs.

The menus have been totally rearranged to give those upgrading something new to learn, and to puzzle new users too no doubt. What flipping objects has to do with formatting is anyone’s guess, and all of the Tools (Spell-check, Thesaurus, and Proof-reader) have been moved to the Text menu. Its not all bad, of course, there are some logical changes, but I recommend spending a few hours customising the menus so that they make sense to you before you start using WebPlus in earnest.

WebTree Combo Box

The site navigation combo box in the status line has been improved to make it much easier to navigate large sites. On opening the combo box, the site structure is shown collapsed or expanded in the state it was when last used, making it easy to move around one branch of a large site without scrolling down a long list of pages to find the right one.

Mobile Phone Redirect

Detect if site visitors are using a mobile device and redirect them to another page. WebPlus can produce high quality sites for mobile devices using redirects, but it does not create responsive sites. See the tutorial on Creating Mobile Sites and Pages

Form Date Picker

A new form control for site visitors to select dates from a calendar.

There are many similarities between PagePlus and WebPlus, so for details of page layout and graphic editing features please refer to the PagePlus review page:

WebPlus lacks some of the finer typographical controls that are not relevant to HTML publishing. For example, OpenType support would not make much sense without @FontFace and Web Font support.

Preview in Browser

From the file menu, select Preview Site. Edit the Browser Preview List to rearrange the priority of any browsers installed on your system. By default, the shortcut Alt P will preview the site in the current window using Internet Explorer. Shortcuts Alt 1, Alt 2, etc., will preview in the browser of your choice. These options will all view a locally saved copy of the current site. From the same Preview Site menu you can also select the option to view the site online in your default browser.

Publish Site

• Publish to Disk Folder — I provide an archive on the home page of my main web site for visitors to download so that they can browse my large site offline. I publish the site to a local folder and create a compact self-extracting archive using 7-Zip.
• Publish to Web — By default, this will publish just the current page. Enable the “Publish All Pages” checkbox to publish the entire site, or select individual pages. Clicking on OK will prepare the selected pages for publication, and the next dialog will show a list of files that will be added, replaced, or left unchanged. It will also tell you the size of an incremental upload or full upload. Choose the former to upload only the changed or new files. To backup the *.wpp document to the web server there is a checkbox on the first dialog. Be aware that this may take a long time, and will not backup any files that are not embedded in the site. Remember to clear the checkbox next time if you just want to test some minor changes.
• Quick Publish to Web — Publish changes to the current page and preview the results in your default browser.
• Maintain Web Site — Manage the site’s files on the server: download, delete, etc.
• Export as Picture — Export the selected object(s) or page to an image format. May be useful for site preview thumbnails, promotional material, customer correspondence, etc.
• Export as PDF — Export the site to a PDF file. There are no options to select individual pages, the entire site is published to a single PDF file complete with backgrounds, images, and non-functional navigation bars. Useful only for students to show their work to their tutors.

Page Layout

WebPlus is a WYSIWYG program, which makes it very easy for beginners to use. There is no need to know anything about HTML code, though if you do you can add some extras. Since I learnt web publishing on NetObjects Fusion, and do all of my paper and PDF publishing using PagePlus, it is very for me to create web pages in WebPlus. Layout tools make it easy to arrange text frames, artistic text, images, tables, calendars, and other objects on the page.

• Master Pages — Place navigation bars or other elements that repeat on each page or on many pages on the master page. Set a background colour or image background for the whole site in the master page properties.
• Paste in Place — To copy an object on one page to the same position on another page, use paste in place.
• Rulers — The rulers are enabled by default, but I don’t find them very useful so I disable them to save space
• Dot grid — Some users like to use a grid to lay out pages. It can be customised in Tools, Layout, Snapping, Dot Grid.
• Layout Guides — Red by default, these can be used to align objects. The colour can be changed in Tools, Options, Layout, Layout, Guide colour. By default guides are “sticky,” that is objects that are snapped to guides will move if the guides are moved unless the Alt key is held down while dragging the guide. Horizontal guides can be dragged down from the horizontal ruler, and vertical guides dragged across from the vertical ruler. To reverse that action, hold down the Alt key and click/drag to place a guide at that point on the ruler. Right-click on the rulers to lock guides or to hide the rulers.
• Dynamic Guides — If dynamic guides are enabled in Options, or from the Snapping flyout at the bottom right of the hintline at the bottom of the WebPlus window, objects can be aligned to their edges or centres by dragging them with the mouse.
• Snapping — Snapping of objects to each other, to layout guides, grid dots, or rulers marks, can be toggled from the snapping flyout at the bottom right of the hintline, or in Options. The default snapping distance can be changed in options too.
• Align tab — On the right of the WebPlus window is a left pointing arrow that will open a Studio if clicked or hovered over with the mouse cursor. The align tab can be used to align selected objects, or to space them evenly.
• Transform tab — The transform tab can be used to resize and position objects with pixel precision. Select the anchor point to determine which corner or vertex to measure from.

Working With Text

Text can be edited directly on the page, or in WritePlus — a powerful text editor built in to WebPlus. WritePlus opens in its own window, and task switching can be used to view the layout on one while editing a text frame on another page. WebPlus has several powerful tools for working with text, whether it is in HTML text frames, Creative text frames, Artistic text, or text in Tables and Calendars.

• Autocorrect — WebPlus comes with an extensive list of automatic typo corrections and you can add your own in Tools, Options, Text, Replacements, and add exceptions to the Abbreviations so that words after i.e., e.g., etc., are not capitalised automatically. Automatic replacements can also included formatting. Select some formatted text, and open the options menu to add it to the list of replacements.
• Spell-check — Spell-checking is available for several languages, and the dictionary used is context-sensitive depending on the language of the current text. If no language is selected from the Text menu, Character, Language, then no errors will be underlined in red. Spell-check as you type can be disabled in Options, Text, Proof-reading, and custom dictionaries can also be created here for custom user word lists. Use different dictionaries for different projects. See this thread on Sharing Dictionaries between different Serif products and versions.
• Proof-reader — The proof-reader will check grammar and spelling.
• Thesaurus — See a list of synonyms and antonyms.
• Import — Text can be imported from popular word-processing formats such as Word, OpenOffice, WordPerfect, or AmiPro, or using the universal Rich Text Format used by WordPad etc.
• WritePlus — This built-in rich text editor offers a clean screen window without the site background, and an independent zoom setting for easy proof-reading of text. Fields such as anchors can be shown or hidden, and an optional styles pane shows the current paragraph style.
• Export — From WritePlus the current story can be exported for backup purposes, or for sharing with other applications or other web sites. WritePlus has its own format for use in WebPlus or PagePlus, or Rich Text format can be read by many other applications.
• Paragraph Styles — Use paragraph styles and character styles to maintain a consistent look throughout your site. Typeface, font size, font colour, line-spacing, justification, or language, can be modified globally by editing the paragraph style. Change the formatting at the cursor position, and update the text style from the Text menu to change it everywhere.
  I use this so often that I have added a custom button to my customised toolbar to do it with one click. The Text Styles Palette, which by default is in the studio on the left of the WebPlus window with the HowTo tab, is also a useful way to manage paragraph and character styles. Open the drop down list by each style to manage the style. Use the Text Styles Tab to select all instances of one style, and apply a different one. Reapply the style to remove any local formatting, and make all paragraphs the same again. Base one style on another to create a hierarchy so that editing the parent style will affect all of its children.
• Change Case — From the Text menu, Change case submenu, change the case of the selected text to: Sentence case, lowercase, UPPERCASE, Title Case, or toggle the current case.
• Toggle Character Code – Use this command (shortcut Alt X) after a character to get its hexadecimal Unicode character code, e.g. € = U+20AC
• Sort Word List — Sort text lines, paragraphs, or table rows alphabetically.
• Autofit — Intelligently resize text to fit the current text frame.
• Frame Setup – Set the frame margins for HTML text frames, or set the number of columns, gutter width, and margins for Creative text frames.
• Overflowing Text — If there is too much text for the current text frame, choose to hide it, or show a scroll bar automatically or always.
• Vertical Alignment — Align text vertically in a text frame or quick shape.
• Ensure HTML Compatibility — Toggle between HTML and Creative Text Frames.

Tables and Calendars

WebPlus includes the table and calendar features from PagePlus, making it easy to create tabular layouts of club fixtures, competition results, product price lists, and so forth. Automated calendars offer many different layouts, and the calendar format editor extends the default styles to produce all kinds of designs. Tables can be HTML tables, or Creative Tables, but they are not dynamically updated.

Inserting Images

A wide range of popular image formats can be imported: BMP, FPX (Kodak Flash Pix), GIF, Animated GIF, ICO, JPG, J2K (JPEG 2000), IMG (Digital Research), PCD (Kodak Photo), PCT (Macintosh PICT), PCX, PNG, Animated APNG (Always use original file for export), PSD (PhotoShop), PSP (PaintShop Pro), RAS, SPP (PhotoPlus), SVG and SVGZ (Exported to bitmap formats), TIF, TGA, WDP (Microsoft HD Photo), EMF, SMF (Serif Metafile), and WMF.

Images can be left floating in the page, placed inline allowing text to wrap around them, or placed to behave as characters that flow with the text. Image export options determine how they are output. Run the Image Export Manager from the Tools menu to set the options for each image.

WebPlus comes with a selection of clip-art and stock photos. Open the Gallery tab on the right to select clip-art, open the Media Bar at the bottom of the window to browse the collection of photos. Add your own photos to new albums in the media bar, and organise them for each project. Drag and drop images onto the page, or into picture frames. Search albums using image tags.

Images can also be scanned directly into WebPlus or inserted from a Photo CD.

Manipulating Images

Images can be adjusted using the context toolbar, recoloured using the swatches tab, special effects can be applied, and tools can be used to crop, resize, or rotate them. Artistic effects or Pro Edits can be applied using PhotoLab (or edited in PhotoPlus if you prefer), and unwanted parts of photos can be removed using the Image Cutout Studio.

Metafiles can be converted to curves and ungrouped to break them apart. To recolour them, right-click and select the “Colour mapper.” Quick Shapes and lines can be used to create new images or add to existing clip-art. Selected objects can be converted to bitmaps, or exported in popular image formats at the desired resolution.

To insert a photograph inside a shape, place the shape over the photo, select them both, and from the Tools menu, select “Crop to shape.”

To replace an image with another, double-click it, or click the “Replace picture” folder icon at the bottom of a selected image. This will not change the shape or size of the placed picture, so unless the image is replaced with one of the same dimensions ratio it will be distorted. In PagePlus, there is an option to convert a picture to a picture frame, but this option is missing from WebPlus. To work around this, select the square crop tool, and just click on one of the resize handles without dragging it. The picture will become a picture frame, and the picture can then be replaced without being distorted by setting the frame properties to “No scale.”

Photo Galleries

Flash or Javascript photo galleries are a convenient way to display a large number of images in a small space on the web page. Professional Flash galleries load the images intelligently to reduce band­width usage.

Animations and Media

Another way to show multiple images in one place is to use animated GIF images with a slow frame rate. Animated PNG images (APNG) are supported by Firefox and Opera, but remember to set the export options to “Always use original image file and (never resample).” A rollover or animated marquee is another method (insert web objects).

Insert Shockwave Flash, Video, YouTube Video, or a Google Map. Unless there is a very good reason, avoid embedding sound in web pages. It is more likely to drive users away from your site than make them stay. Embed a media player or clickable link to start playing the audio file.

Smart Objects

This are interactive objects like Forums that make use of Serif Web Resources. The content of the Smart Object on the web page updates dynamically as the content is modified by users. Note: SWR will cease to function on August 31st 2018.

Site Search

Insert a results field first, then a site search to allow site visitors to search your site.

RSS Feeds/Podcasts

RSS feeds are indicated by a symbol by clicking on which the user can subscribe to that feed and keep up-to-date with any developments. Podcasts are syndication feeds just like RSS feeds, but offer slightly different options that reflect a podcast's use of digital media such as audio and video files. Put simply, RSS feeds will publish articles, while podcasts will broadcast information as episodes.

Page last updated on 25 December 2024