Posts in Category: Site Design

mojoPortal Released

I'm happy to announce the release of mojoPortal, available now on our download page.

This is not a major update but it does have some things to make it worth upgrading.

Editor Updates

Both CKeditor and TinyMCE put out new releases with bug fixes and updates, many of which are related to IE 9 and Firefox 4.
Upgrade to CKEditor 3.5.3
Upgrade to TinyMCE 3.4.2

There was an error happening under .NET 4 Medium Trust hosting related to our older FCKeditor. Nothing had changed in this editor for a long time so I'm surprised that we had never seen this error until recently. It makes me wonder if there was some behavior change that came with a recent Windows Update. In any case, the error is fixed in this release.

jQuery Updates

We had a bug report about our jQueryUI Date Picker where it was not formatting dates correctly for en-NZ. It turned out that support for en-NZ was only added to the jQueryUI Date Picker as of version 1.8.9, so the solution was to upgrade to a newer version. However, we had been holding off on upgrading jQueryUI because we knew there was an issue in the Time Picker extension that we were using where it did not work with newer versions of jQueryUI than 1.8.6. Fortunately, we found another Time Picker extension for the jQueryUI date picker and it seems to work with any version of jQueryUI.

So we updated to jQuery 1.5.2 and jQueryUI 1.8.11. Note that upgrading is really just changing 2 config settings since we load jQuery and jQueryUI from the google CDN. So if you are using any custom jQuery plugins and they don't work with the newer versions of jQuery or jQueryUI, you could override the version from user.config to keep using an older compatible version of jQuery or jQueryUI.

date time picker screen shot

Support for Newsletter Throttling

It had been requested a while back to have a way to throttle the sending of the newsletter. Blasting out an email to a lot of users in a short time can make it look like spam to some receiving mail servers, especially if you are using a consumer email account or you don't have a well known reputable mail server. So it can be beneficial to limit the rate at which you send the email messages to your list. The mojoPortal newsletter subscriber list is getting pretty large and we had some trouble with our February newsletter due to sending the emails too fast. I got a few non-delivery notifications from and others saying that we sent too many in a short period of time. So it was a priority to implement this before we sent the March newsletter. It really helped as we had no non-deliveries related to sending them too fast. 

There is a new setting that you can override in user.config:

<!-- you can throttle the sending of the newsletter 0 = unlimited/no throttling -->

<add key="NewsletterMaxToSendPerMinute" value="0" />

If you enter a number greater than zero it will sleep for one minute after each round of sending that many. So if you set it to 10, it will blast out 10 in a row and then sleep for a minute and the repeat until it sends to each subscriber in the list. I set it to 10 before sending the March mojoPortal newsletter. Of course the larger the list the longer it will take but you can calculate approximately how long it will take at any given rate and you can use a higher setting to send them faster if you need to. 


Support for custom regex and error message for email validation on the registration page, you can override our defaults with these settings:

 <add key="CustomEmailRegex" value=""/>

 <add key="CustomEmailRegexWarning" value=""/>

Support for more page settings when creating initial content from config files

Support for configuring the Thread UICulture separately from the Culture. The UICulture is only used for choosing the resource files, whereas the Culture is used for formatting numbers, currency, and dates.

This example uses German for the numbers and date formats and uses English for the resource files.

<add key="UseCultureOverride" value="true" />

<add key="site1culture" value="de-CH" />

<add key="site1uiculture" value="en-US" />

Fixed bug in the SQL CE data layer that prevented the Newsletter feature from working in our package for SQL CE.

Lots of updated translations thanks to our Translation Team

Other miscellaneous little tweaks and fixes for things reported in the forums since the last release.

Follow us on twitter or become a fan on Facebook

follow us on twitter become a fan on facebook

Gravatar Joe Audette is the founder of the mojoPortal project and was the primary developer until February 2017.

mojoPortal Released

I'm happy to announce the release of mojoPortal, available now on our download page.

Improved Usability for Multi Site Administration

There is a new site list page, that provides a link for creating new sites and a pageable list of existing sites. If you want to show the site id in the list you can add this to user.config
<add key="ShowSiteIdInSiteList" value="true" />

site list screen shot

Improved Usability for Managing Large Site Hierarchies

When creating or editing pages there has always been a dropdown list for selecting the parent page or you could set it to root for a root level page. When sites have a large number of pages this dropdown list would become unwieldy, so we implemented a new dialog page for selecting the parent page, the dialog pages uses a treeview with populate on demand to drill down to the page you want to use as the parent page so it can better handle large numbers of pages.
The dropdown list is easier to use for sites that don't have a huge amount of pages so we made it continue to use the dropdown if the number of pages in the site is less than 150. You can configure the setting if needed or desired. For example if you prefer to always use the dialog page then you could set it to 0.
<add key="TooManyPagesForDropdownList" value="150" />

New Child Pages Site Map Module

Pages have had a setting for a long time allowing you to show the child pages site map as a menu. This can be very useful especially for pages that are just used for grouping of child pages.
But the child page site map built into the page has some limitations, for example if you want to have content on the page in addition to the child page site map, it could either go above or below the child page site map depending on the position of the control in layout.master

<portal:ChildPageMenu ID="ChildPageMenu" runat="server"></portal:ChildPageMenu>

so it was an either or kind of thing you could not do it differently on differnet pages unless you used a different skin.

So, Joe Davis implemented a new Feature Module for Child Page Site Map that you can put on a page just like any other content feature and this allows you to position it any way you like, even in side columns

Support for Slide Show Pager in Html Content Feature

Again, thanks to Joe Davis who implemented some default css and other changes needed to support the pager for the jQuery Cycle plugin that can be used in the Html Content feature for making slide shows out of html elements.

Image Gallery Improvement

Changed to use colorbox, a nicer lightbox effect instead of the previously used greybox thanks to Jamie Eubanks.

List/Links Improvement

It is now possible to browse in order to link to pages or files within the site, similar to the link browser that was already implemented in the wysiwyg editor, the new link browser populates the url textbox in the List/Links feature.

Support for Roles That Can Manage Users

allows delegating user management to users without making them full administrators.

Registration Page Improvements

Previously we could make custom user profile properties that were required for registration to appear on the registration page, but there was not a way to show optional custom profile properties on the registration page. It is now possible.

The registration agreement is now per site and has an edit page, previously it came from config files and was global to all sites in an installation.

Improvements to the Initial Content System

The Initial Content System is used to populate the first site during installation and to populate new sites when they are created. We've made changes for better support for configuration of nested pages and also created an interface that can be implemented for populating custom features. I will be updating the documentation for the Initial Content System in the next few days and will update this post with a link once it is completed.

UPDATE 2011-03-31 I've updated the article Configuring Initial Content, and added another article Populating Feature Content.

Improvements for Design/Skinning

It is now possible to import and export skins as .zip files and there is a new permission in Site Settings for "Roles That Can Manage Skins". It is also now possible to edit css files in the browser. While it is probably better to do the main skin development on your local machine, it is possible to edit css files in the browser and it is useful for small css tweaks.

You can disable the ability to upload skins and edit CSS by adding this to user.config:
<add key="AllowEditingSkins" value="false" />

I have it disabled for example on the demo site.

skin manager screen shot

There is a new Page Setting that allows page specific css classes on the body tag as well as a setting for page specific menu css classes.

There is a new class on editor body making it easier when you need to override some of the styles in the editor, you can do it with body.wysiwygeditor {} in CSS.

All of the skins that ship with mojoPortal use h1 for the site name and h2 for headings of feature instances. Some designers prefer for SEO (Search Engine Optimization) reasons to not use a heading at all for the site title and use h1 for the feature instance headings. In the past we had a global config setting that could be used to override the heading:

<add key="ModuleTitleTag" value="h2" />

In the new version, it is possible to edit the setting used for feature instances right from the Feature Instance Settings page (ModuleSettings.aspx). The heading is now stored in the database so it is possible to use different headings on different instances. When new instances are created it defaults to whatever you have for this setting: <add key="ModuleTitleTag" value="h2" />

This is an advanced feature and it is possible to put something incorrect for the heading element, so it is disabled completely by default and even when it is enabled it is limited to users in "Roles That Can Manage Skins". You can enable it by adding this to your user.config:

<add key="EnableEditingModuleTitleElement" value="true" />

Since this is a new data filed used for the heading element, existing data will be updated to have h2 which is the default. However if you were previously using the config setting to force a different heading, for example if you were forcing it to use h1 by using this setting:

<add key="ModuleTitleTag" value="h1" />

then you will need to manually update the existing data by running a sql query like this:

UPDATE mp_Modules
SET HeadElement = 'h1'

Then going forward it will use the config setting for the default on new instances.

We also did a lot of work to make menu and treeview rendering more flexible. It is now possible to control which CSS classes are rendered on the menu ul, li and a elements. In the coming days I will be writing documentation about the new settings available and how to use them. I will update this post with links as I progress with the documentation.

The available on the download page also has updated skins for Artisteer 3.0 beta, as well as a number of skins contributed by community member Hennadiy of CMS-Web e-Business Solutions.

As always you should review the sticky thread about important skin changes that you will need to apply to your custom skins after upgrading.

Other Stuff

The friendly urls used in mojoPortal can be problematic for some non-ascii languages, we've had a config setting for a while that could disable it for CMS pages, but it has been requested to also be able to disable it for blog posts. It is now possible to do this from user.config
This setting disables it globally in the blog feature.

<add key="Blog:UseFriendlyUrls" value="false" />

You can also disable it for specific module ids using this pattern, where th number is the module id.

<add key="Blog:UseFriendlyUrls-3" value="false" />

As many of you probably know, javascript wysiwyg (What You See is What You Get) editors don't work in devices such as iPad, iPhone, Android, etc. Historically we have degraded to a plain text area for these devices so at least it is still possible to edit or post in the forums. In this release we integrated MarkItUp textarea editor for use with iPad and smart phones for a little better editing experience than a plain textarea. It is not a wysiwyg editor, it is an editor for html editing, the content in the editor is still raw html but there are convenient toolbar items to help you write the html.

Upgrade to TinyMCE 3.4.1
Upgrade to CKeditor 3.5.2

Many translation updates, thanks to all our translation team members and to the Amanuens service!

Various bug fixes for things reported in the forums since last release.

Corresponding Updates for Add On Products

An Update for NeatUpload is also included and this required us to make corresponding compatibility updates for Form Wizard Pro and Web Invoice Pro. Customer who have purchased these products can get the update from their purchase history under the "My Account" link.

Follow us on twitter or become a fan on Facebook

follow us on twitter become a fan on facebook

Gravatar Joe Audette is the founder of the mojoPortal project and was the primary developer until February 2017.

mojoPortal Released

mojoPortal is now available on our download page.

This is a compatibility update for the changes in ASP.NET that resulted from the security patch recently released by Microsoft and now available from Windows Update. I blogged about this issue previously and provided a workaround for the compatibility issue, this new release eliminates the need for the workaround.

Before the security update, there was a possibility for a System.Security.Cryptography.CryptographicException when decrypting the role cookie if the machine key had changed and the user was already authenticated. We already had error handling for this error, but after the security update the behavior changed and it would throw a more generic HttpException there which we were not handling, and this would cause users who were previously authenticated to experience an error until they cleared the cookie. Even without a machine key change, the same error could happen if a user was authenticated before the windows update was applied, the error could happen for that user after the update was applied (because there were also changes to how cookies are encrypted in the security update) In this release we have added handling for the new more generic exception so the cookie will be reset if this error occurs and the user will not experience an error on your site.

We've also removed the previous workaround for the ASP.NET security issue since it is not needed after the update is applied.

Other Changes

Thanks to Steve Railsback of Colorado State University we have some new CSS that can be used to add images to the Administration menu. It uses some Crystal Icons which are licensed under LGPL. I've updated many of the included skins that ship with mojoPortal to use the new icons, you can easily add them to your skin by adding this to your style.config file:

<file cssvpath="/Data/style/adminmenu/style.css" imagebasevpath="/Data/style/adminmenu/">none</file>

It will transform the admin menu from a plain looking vertical list to a list of images with hover effects like this:

screen shot of admin icons

This release also has:

  • upgrade to CKeditor 3.4.1
  • upgrade to TinyMCE
  • updated Italian resource files thanks to Diego Mora
  • fixed a bug where menu items that were configured as unclickable were still clickable in the breadcrumbs

I'd also like to point out a new article in the skinning documentation written by Steve Land, Using Wireframe Skins. Steve has shared a skin he designed to solve the problem of how to keep your discussions with clients focused on functionality when you need to. It is a very common issue that the customer can easily get side tracked onto colors and other visual aspects which is fine if you are trying to discuss the design but distracting if you are trying to focus the discussion on functionality or other non-design aspects of the site. The wireframe skin can help with this because it is designed to not be distracting and to clearly represent that the design is not what is being shown. Please let Steve know if you find his wireframe skin useful if there is interest he might make more variations.

Follow us on twitter or become a fan on Facebook

follow us on twitter become a fan on facebook

Gravatar Joe Audette is the founder of the mojoPortal project and was the primary developer until February 2017.

mojoPortal Released

I'm happy to announce the release of mojoPortal, available now on our download page.

What's New?

jQuery UI Skin

This release includes a new skin based on jQuery UI, as described in my previous post, there is also a theme picker for choosing the jQuery UI theme. There are a bunch of pre-defined themes and you can roll your own with the jQueryUI theme roller, so this skin is like many skins in one.

A number of people have been asking in the forums about how to make menu items not clickable. Typically people want this when they are using a flyout menu like the jQuery Superfish menu or the horizontal menus used in Artisteer skins. Usually there is a parent page that is just a container for child pages that have the actual articles, and you may wish to make the parent menu item not clickable. If the user clicks it, it is the same as if they mouse over it, it just shows the child items and does not navigate to the page. This is now supported as described in the documentation article Un-clickable Menu Items.

Feature Setting Groups

This is something I've been meaning to do for a long time, when a feature has a lot of settings (like the blog for example), the settings page could become very daunting just because there are so many settings. By adding groups, we can organize the settings into logical groups that make it much easier for the user to digest because they can view one group at a time.

feature setting groups

A Few Blog Improvements

As the screen shot shows, there are some new settings for the blog. You can now add extra content into the blog side bar in 2 locations. This is suitable for adding a blog roll or an advertisement or other content you would like to add to the sidebar of the blog.

There is also a new Tweet This link available in the blog, located in the Social Settings.

Limiting Available Features by Roles

This is another popular request in the forums, many users have asked about being able to filter the list of available features by roles. This is now possible from Administration > Advanced Tools > Feature Configuration, you will see a new link for permissions next to each feature and you can set roles allowed to use the feature. Note that it only controls what is available in the list when creating new content, it does not change a user's permissions on existing instances of a feature.

Other Stuff

  • Upgraded from TinyMCE 3.3.7 to 3.3.8
  • Upgraded from CKeditor 3.3.1 to 3.3.2
  • Upgraded to the latest MySql Connector
  • Updated Italian resources thanks to Diego Mora
  • Updated German resources thanks to Jan Aengenvort
  • the Extra Skins download file has a new skin contributed by Nitin Sharma

Bug Fixes

  • fixed a redirect bug when using the MyPage feature in folder based child sites
  • fixed an issue where the tabs did not work correctly on the user profile and manage users pages in folder based child sites
  • fixed a bug where consuming the aggregate feed from on feed manager into another instance of Feed Manager caused the page to hang
  • fixed a bug where the download link in shared files did not always work correctly in IE 8
  • a few other bug fixes and enhancements based on feedback in the forums and by email

Upgrade Notes

After the previous release, 2 people reported errors upgrading and were not able to upgrade. I believe this issue happens only with SQL 2005 if it does not have all the service paks installed. This is related to changes we made to consolidate the MS SQL layer so it could support SqlAzure. In making the needed changes we made a conscious decision to drop support for SQL 2000, so our MS SQL Data layer is designed to support SQL 2005/2008/SqlAzure, but it turns out that SQL 2005 only works if you have the service paks installed. I was already running SQL 2005 Express with all service paks, so I did not anticipate any issues with SQL 2005, but apparently there are problems if you are not up to date on service paks. As always, you should backup your site and database before upgrading, and if you are using SQL 2005 you should check whether you have the service paks installed before upgrading.


Nominate mojoPortal for the 2010 CMS Awards

Follow us on twitter or become a fan on Facebook

follow us on twitter become a fan on facebook

Gravatar Joe Audette is the founder of the mojoPortal project and was the primary developer until February 2017.

mojoPortal and jQueryUI ThemeRoller

I was recently reading the documentation for The jQuery UI CSS Framework, and it got me thinking about making it possible to style mojoPortal content instances using it. Then a user asked in the forums about being able to skin mojoPortal using jQueryUI ThemeRoller, and that got me thinking further, what if I could create a mojoPortal skin where the whole site is a jQuery UI widget and could be styled by jQuery UI themes? That would be kind of cool, wouldn't it? 

It doesn't take much to make a feature instance style as a jQuery Widget, skeleton markup like this will do the trick since the jQuery UI CSS is already included in the page:

<div class="ui-helper-reset ui-widget ">
 <h2 class="ui-widget-header ui-corner-top">Heading goes here</h2>
 <div class="ui-widget-content ui-corner-bottom">
   This is styled with jQuery UI!

So I just needed a way to make mojoPortal features render that kind of skeleton and it wasn't difficult to achieve given that I had already implemented a solution for rendering the special markup needed for Artisteer designs. I just added some more options to the rendering that can be configured from the file in a mojoPortal skin. It took me maybe 10 minutes and I had it working for proof of concept. It was much easier than implementing support for Artisteer because we already had the needed markup structure, all we really needed was an option to render the CSS class names for jQueryUI. So I made a new skin and modified the layout.master to use the same widget skeleton for the site as a whole so that the jQuery UI theme pretty much controls the look of the site. There isn't yet any themeable menu for jQuery UI, so I used the jQuery Superfish menu that we were already using in a few other skins and used neutral colors and color inheritance to make it look reasonably well with all of the jQueryUI themes, though it looks better with some than others. It would be easy for users to copy this skin and change the menu colors to match better with a specific theme. The jQuery UI CSS framework doesn't have style for all purposes and features, though, so additional CSS is needed for some features, and again I tried to make it use neutral colors so it would not clash with any of the jQuery UI themes.

I'm a ThemeRoller baby, bound to roll all over you...

ThemeRoller makes me think of James Taylor singing with a lisp! :-D

Once I had the new skin basically working it begged for a theme switcher so I could see the magic instantly of changing the jQuery UI theme. There are about 25 or so standard jQuery UI themes that can be loaded from the Google CDN (Content Delivery Network) which is where we load jQuery and jQuery UI javascript and CSS from by default. You can also make your own custom jQuery UI themes with ThemeRoller, but if you do that then you need to host the jQuery and jQuery UI files locally as documented here.

You can control the list of available themes in the theme switcher from a config setting, that you can override in user.config, and you can set the default theme in the layout.master file of the skin like this:
<portal:StyleSheetCombiner id="StyleSheetCombiner" runat="server" JQueryUIThemeName="eggplant" UseIconsForAdminLinks="false" />

The theme switcher can be removed from the layout.master or disabled or limited by roles if you don't want a user to be able to change the theme. It is basically setting a cookie based on the dropdown choice, and then setting the jQuery UI theme based on the cookie.

Maybe it is too widgety looking for most sites, but it might be useful for some kinds of sites or web applications built on mojoPortal. You could easily add a div above and/or below the menu to make room for a banner ad or some other additional content.

Anyway, it was easy and fun to implement. It is in the source code repository now but requires a build of the latest source code to work. It will be included in the next release. You can try it now on by going to Administration > Site Settings and choose the jqueryui-1 skin. 

So basically the new skin jqueryui-1 is like many skins in one since there are many jQueryUI themes available and you can roll your own with ThemeRoller.

Here are a few screenshots showing a few of the jQueryUI themes.

mojoportal with jquery ui eggplant theme

mojoportal with jquery ui excite bike theme

mojoportal with jquery ui dark hive theme

mojoportal with jquery ui humanity theme

So, look for this in the next release or if you are a developer you can get the latest code from the repository. I think this gives us one more useful approach to skinning mojoPortal and hope you find it useful.


Follow us on twitter or become a fan on Facebook

follow us on twitter become a fan on facebook

Gravatar Joe Audette is the founder of the mojoPortal project and was the primary developer until February 2017.