SEO Friendly Markup Tips for Exponent CMS Developers

As I've optimized Exponent CMS websites over the years, one of the challenges that I've discovered is making sure the developers understand the proper SEO friendly markup principles required to maximize the organic search value of the site.

It's not that I blame the developers for some of the markup oversights I've come across when analyzing the level of SEO friendliness an Exponent CMS site might have – after all, it's their job to build the sites and the SEO consultant's job to optimize them.

With this in mind, I've come up with these SEO friendly markup tips to educate Exponent CMS developers who might not be as SEO savvy in order to make the development process more efficient – particularly for websites undergoing an organic search optimization program.

Don't apply the H1 Tag to the Website Logo

I've seen this done many, many times, where developers have created a logo style class in the CSS and have applied an H1 tag to the logo in every subtheme of the site.

SEO Friendly Markup Tips for Exponent CMS Developers

The problem with this from an SEO perspective is multifaceted. First, because the logo is typically at the top of the page markup, this H1 tag is the first tag that the search engine spider sees as it's crawling your page top to bottom.

In terms of content structure, the H1 tag is your web page's most important header tag, followed by the subheader tags H2 and H3, because it tells the search spider what the main topic (or keywords) is for the page. You also only want to use one H1 tag per web page. So if you're using the H1 tag in this fashion, you're literally telling the spider that whatever your logo title text is, is the main content topic for each page.

It also means that if you're building your Exponent CMS site with SEO in mind, you most likely have multiple H1 tags on each of your web pages, which isn't ideal for proper on-site optimization.

Don't Rely on Exponent's Out-of-the-Box Module Title Markup

SEO Friendly Markup Tips for Exponent CMS DevelopersThere are a lot of built in features that Exponent CMS has that are meant to be convenient time savers when it comes to markup.

One of those being the across-the-board H1 tag that is applied to each module title field.

The problem with this dovetails on the H1 logo markup that I discussed above, where if you're utilizing multiple types of content modules on one page, it becomes very easy to have multiple H1 tags on that single web page, which again, isn't best practice for on-site optimization.

If your homepage has a normal text module with a strong H1 tag, but you also have an upcoming events section, as well as a latest news section using a news module in summary/headlines view, topped off with a footer utilizing 3 or 4 separate link manager modules, you have potential for 7 or 8 different H1 tags on that one web page if you simply used Exponent's stock module markup.

Proper Markup Makes All the Difference

I'll illustrate for you an example of how using these two SEO friendly markup tips above can make a tremendous difference.

Earlier this year I had experienced some issues with a client's Exponent CMS website that was undergoing an SEO marketing program. The problem with the site was that we couldn't seem to get passed page 3 of the organic search results, and Google couldn't really decide which of our web pages it wanted to rank for some of our targeted keywords. Every couple of days, the page on our site that would show up in the middle of page 3 would change from the homepage to an internal page.

When I started digging into the code, I realized we not only had the H1 tag applied to our logo, but we also utilized all the stock module title H1 tags, so we had 9, yes 9 H1 tags on our homepage alone.

After finding this markup issue, we quickly stripped the H1 tag off of our logo, assigned H2 or H3 tags to our module titles that weren't the most important header tag our each of our web pages, and within about 10 days of me re-submitting our site through webmaster tools, we finally climbed onto page 1 of the search results, and to this day, every web page on this clients' site sits in the top 3 of the organic results.

If you're an Exponent CMS developer who has been utilizing these H1 tags in your markup, you might want to consider these SEO friendly tips to not only improve the organic value of your websites, but also to make your lives easier so you don't have to go back and fix it at a later date.

About the Author

Chris Everett is an SEO specialist in Atlanta, GA, and the founder of the Captivate Search Marketing Atlanta SEO Company.

To learn more about the technical SEO aspects of Exponent CMS, connect with Chris on Google+.

 

 

SEO Friendly Features of Exponent CMS

I've worked with Exponent CMS in a variety of roles since 2007, from being merely a user/customer of OIC Group, Inc., to becoming a project manager for OIC Group, and now as a SEO consultant for my own business in Atlanta.

While Exponent CMS doesn't have the community following of Wordpress, Joomla, Drupal, etc., I've had experience with all of these top CMS platforms, but Exponent is always the one I come back to.

In terms of SEO friendliness, Wordpress has several plugins that work quite well for optimizing websites, but what I love about Exponent CMS is that the markup is highly flexible and all of the SEO tools needed for to optimize your website are built in – no plugins necessary.

Over the last several weeks, I've been working with the lead developers on the Exponent CMS project – Phillip Ball and David Leffler – on enhancements to the CMS that make Exponent even more SEO friendly than it already was. In the coming weeks, we'll be adding even more features that I personally believe will make Exponent the most search engine friendly CMS platform in the open source marketplace.

So, aside from being able to control basic Meta Data on a page by page basis, what are some of the other built-in SEO friendly features of Exponent CMS?

Router Maps

When you're working with a CMS that allows for dynamic content publication and display, you're going to run into problems with long, nasty URL strings that include parameters for views, actions and sources that aren't friendly for either users or search engines.

Such is the case with most of the dynamic content modules within Exponent CMS such as news, portfolio, blog, ecommerce, etc. Luckily for SEO enthusiasts such as myself, Exponent has built in an awesome feature called Router Maps that allows you to clean up that nasty URL strings with a cleaner, more search engine friendly version of the URL.

For example, the dynamic blog module URL below is performing the “Show All By Tag” action, where a user can view every blog post that is labeled with that specific tag. The Exponent CMS site will dynamically pull up and display each of these posts, which is essential functionality for a blog, but as you can see the URL isn't exactly user friendly:

Dynamic Exponent CMS URL String

By configuring the Router Map function in your Exponent theme folder with the appropriate rule, you can change that nasty URL to a cleaner one such as this:

Exponent CMS Clean Router Mapped URL

Flexible URL Structures

Since SEF (Search Engine Friendly) URLs were integrated into Exponent in 2007, they've evolved to become more and more flexible for SEOs.

The benefit of SEF URLs, aside from being easy for users to read, is that SEOs can craft custom optimized URLs with keyword inclusion to make their clients' websites more friendly for organic search.

Exponent allows administrators to assign a variety of URL extensions to their SEF URL field such as .html, .php, .htm, etc., based on their preference.

Historically, all pages within Exponent CMS would display URLs at the root level.

Exponent CMS URLs

Recently though in Exponent's 2.2.0 stable release, the SEF URL field has become even more flexible. The system now allows for nested URL structures that are preferred by some SEO consultants that allow URLs to look like this:

Exponent CMS Enhanced Nested URL Structures

The flexibility of how SEOs can execute their URLs within our system makes Exponent a very powerful platform for websites focused on SEO and search engine placement.

Rel=Canonical URLs

Another new feature added in the 2.2.0 stable release is support for Rel=Canonical URLs on a page by page basis.

For SEOs dealing with large websites that have potential duplicate content issues (having the same exact content appearing in multiple places on your website, or if your site is receiving syndicated content), the Rel=Canonical tag configuration allows SEOs the ability to easily assign credit to a preferred source URL in the event that duplicate content needs to be avoided.

Exponent CMS Rel Canonical URLs

Rel=Canonical tag fields have been integrated throughout the system in the page manager configurations, and in specific dynamic module types such as Exponent's news, portfolio, blog, and ecommerce modules.

File Manager Image Meta Data

The final feature that makes Exponent CMS a SEO friendly CMS that I'll discuss in this post is related to Exponent's file manager and attachable files functionality.

Certain modules within the system utilize “attachable files” functionality to display images in certain views/layouts.

For example, Exponent's ecommerce, blog, portfolio, and news modules use attachable image files to display images related to that product/portfolio piece/post:

Exponent CMS Attachable Files

The SEO friendly feature related to this functionality is how the image is optimized for organic search engine value.

Rather than simply inserting image files into the WYSIWYG editor for display on the website as you would using a text module, you can assign your Image Alt Text and Image Title tags for attachable files within Exponent CMS' file manager.

Exponent CMS File Manager Image Meta Data

So as you've optimized your attachable file, your image Alt text and Title tags will show up in the HTML markup just as if you had inserted your image into a WYSIWYG editor and optimized the image that way:

Exponent CMS Attachable Files Image Meta Data

Future Exponent CMS SEO Friendly Feature Enhancements

As the CMS continues to evolve, I've made it my personal mission to ensure that we work in every SEO friendly feature possible into Exponent CMS.

In future releases, we'll be working on such enhancements as allowing administrators to configure “No Index, No Follow” type robots tags on a page and post level.

We also plan to enhance the Exponent CMS tagging system so administrators will be able to assign unique SEO friendly meta data on a tag by tag basis, as well as add link title attributes to the Exponent CMS link manager module configuration.

If one thing is for certain as we continue to make Exponent CMS more and more Search Engine Friendly, it's that our system is incredibly powerful and its future is very bright.

About the author

Atlanta SEO Consultant Chris J. EverettChris Everett is a contributor to the Exponent CMS project.

Chris is a search engine marketing consultant based in Atlanta, Georgia, and he's the founder of the Captivate Search Marketing SEO Company.

To learn more about the SEO friendly features of Exponent CMS, feel free to connect with Chris on Google+.

Prepping Your Site for v2.2.0 (or how to deal with a major update)

(Update: we HAVE reverted to the name 'container' instead of 'container2' for release candidate1!)  Here are some tips and tutorials to help ensure your site is 'v2.2 ready'!  While there is really no show-stopping change moving from v2.1.1 to v2.2.0, the move to v2.2.0 will reveal any themes or custom views which haven't been updated to 2.0 standards.  In a pragmatic sense, though the upgrade must be run and completed to convert the database for use in v2.2.0, your site would continue to work using one of the shipped or add-on themes which are 2.2 ready.

Since this upgrade only affects a custom theme and/or custom views, that's where we'll need to look:

  • Theme 1.0 compatibility removed
    • This one is the easiest to spot and correct.  It will occur in the main theme template (/themes/mytheme/index.php) and the subthemes (found in the subthemes folder)
    • Calls to the deprecated 1.0 theme subsystem look like 'exponent_theme_method' instead of 'expTheme::method'  And moreso there are only three mandatory calls with a fourth recommended call for hard-coding other modules
      • expTheme::head(...) in the <head>...</head> section, this method is used in place of the deprecated exponent_theme_headerInfo(...) call
      • expTheme::main() in the main content area in the <body>...</body> section, this method is used in place of the deprecated exponent_theme_main() call.
      • expTheme:foot() at the bottom of the <body>...</body> section, this method is used in place of the deprecated exponent_theme_footerInfo() call.
      • expTheme::module(...) within the main content area for hard-coding (embedding) modules, this is THE single multi-purpose method to display a module in place of many deprecated calls: 
        exponent_theme_showSectionalModule(...), 
        expTheme::showSectionalModule(...), 
        exponent_theme_showTopSectionalModule(...), 
        expTheme::showTopSectionalModule(...), 
        exponent_theme_showModule(...),
        expTheme::showModule(...),
        expTheme::showSectionalController(...),
        and expTheme::showController(...)
        • A big difference between the expTheme::module(...) call and the others (except the last two) is that it is called with a single parameter of an associative array of named parameters, whereas the deprecated ones were called with simple (sequential) parameters.
        • Likewise most of these various calls were to either deal with a 1.0 module or 2.0 controller, or to hard-code a module with a specific 'scope' (global, sectional, or top-sectional), which is now simply a 'scope' named parameter with 'global' being the default.  The expTheme::module(...) call is 'smart' in being able to to it all!
        • Deprecated call - expTheme::showModule($module,$view,$title,$source,$pickable,$section,$hide_menu,$params);
        • 2.0 call - expTheme::module(array("controller"=>"navigation","action"=>"showall","view"=>"showall_mega","source"=>"mega","chrome"=>true));
  • Old School (1.0) modules no longer exist
    • Another fairly easy thing to spot and correct are hard-coding an old school module within the main or subtheme template.  In many cases, these old school modules have been disappearing and references to them as hard-coded modules may have already been exposed.  However some were replaced with like named 2.0 modules (controllers)
    • A big difference between the old and 2.0 modules is old school modules only required a 'view' parameter, whereas the 2.0 modules require an 'action' parameter (with the default view implied).  The old school default (view) was 'Default' whereas the 2.0 module default action is 'showall' and the default view is also 'showall'. Therefore to locate old school modules, they were typically called using a 'module' parameter instead of 'controller' (however each are interchangeable).  Specifically, 2.0 modules need to have an action parameter, whereas the old school modules only pass a 'view' parameter (with NO action parameter).  If the old school view was something other than 'Default', please see the next area of discussion.
    • Here's a list of old school modules and their 2.0 counterparts:
      • simplepollmodule or simplepoll => simplePoll
      • navigationmodule or navigation => navigation
      • calendarmodule or calendar => events
      • formmodule or form => forms
      • containermodule or container => container (this has changed to simply 'container' in release candidate 1)
      • headlineController or headline => text (this is a 2.0 controller which has been deprecated)
    • Here's an example of an update required since most themes include a hard-coded container
      • Deprecated call - expTheme::module(array("module"=>"container","view"=>"Default","source"=>"@left"));
      • 2.0 call - expTheme::module(array("controller"=>"container","action"=>"showall","view"=>"showall","source"=>"@left"));
    • ​​If you've kept up to date through v2.1.1, the only NEW upgrade involves the 'container' module.  
    • The deprecated call may continue to work, but is unsupported.  If it fails to work because this is a module name change, your custom themes will not seem to work (will say that containermodule is unavailable) until it is corrected.
  • Old School Module Custom Views must be updated to work with their 2.0 module counterpart
    • The most complex of the changes will likely be required for any old school module custom views.  These would be found in the //themes/mytheme/modules/ folder using any of the above full module named folders.  In many cases, the custom view could be upgraded by a couple of simple renames.
      • Rename the 'module' folder into its 2.0 counterpart...e.g., 'navigationmodule' into 'navigation'
      • Within the newly renamed folder, enter the 'views' folder and create a new folder with the name of the module, such as 'navigation'
      • Move all the other files (.tpl files) within that 'views' folder into that newly created folder
      • Enter the folder with the moved templates, then rename the view template(s) into a 2.0 suitable name which includes the action:
        • 'Default.tpl' would become 'showall.tpl'
        • 'YUI Top Nav.tpl' would become 'showall_YUI Top Nav.tpl'
    • Any configuration or form files (.config or .form) would need more complex editing.
      • .config files are no longer used as these details must now be handled within the controller itself
      • .form files are now templates within the 'configure' subfolder of the views folder.  They are named by the associated view name with a .config suffix.  The files are now formatted just like a view instead of using the shorthand notation to create controls.  You should look at a system module like 'events' or 'blog' to get an idea of how view specific configurations work.
  • (Updated) Some YUI constants and file names/locations have been deprecated
    • Both of these issues tend to be revealed as improper formatting such as misaligned columns or font styles.
    • The 'Reset' stylesheet names have been deprecated for quite some time (apparently) and were finally removed in YUI v3.10.0.  Since many of the older themes use YUI reset(s) instead of the new 'normalize' standard, here's the changes you'll need to look for and make in the expTheme::head() call at the top of your theme templates (and subthemes) (note the additional 'css' at the beginning of the filename!)
      • cssreset/reset-min.css has become cssreset/cssreset-min.css
      • cssreset/fonts-min.css has become cssfonts/cssfonts-min.css
      • cssreset/grids-min.css has become cssgrids/cssgrids-min.css
    • We have finally removed the deprecated YUI path constants for consistency with other path constants.  These were typically used to load scripts or stylesheets in the theme templates (also subthemes) and custom views)
      • JS_FULL is now JS_URL
      • JS_PATH is now JS_RELATIVE
      • YUI3_PATH is now YUI3_RELATIVE
      • YUI2_PATH is now YUI2_RELATIVE

Other articles of interest:

New Canonical URL Field Makes Exponent CMS More SEO Friendly

Over the years, Exponent CMS has proven itself to be one of the top search engine friendly CMS platforms available in the marketplace – and it just got better.

I recently teamed up with Exponent CMS code ninja Phillip Ball to integrate a new Canonical URL field into the core of the CMS, allowing webmasters to easily add a <link rel="canonical" > tag into the header of their Exponent CMS web pages, on a page by page basis.

The new Canonical URL field, which will be featured this Friday May 3, 2013 in the 2.2.0 release candidate, has been integrated into the Exponent CMS page manager configuration, and you can also assign a Canonical URL when creating a new news article or blog post.

If you're a developer using Exponent CMS and aren't familiar with the SEO ramifications of the Canonical URL field, you might be asking yourself why this new field matters and what its purpose is.

What's the Purpose of Canonical URLs?

In layman terms, what the Canonical URL Tag does is it tells the search engines what URL to give credit to in the case of multiple URLs having identical content.

For example, if you're trying to make finding information easy for your website users by adding the same content in multiple sections of your site, such as pricing information, photo galleries, etc. by using the Exponent CMS content aggregation feature on your website, you've created yourself a duplicate content issue with the search engines.

In this case, it's important to assign a <link rel=”canonical”> tag on the pages to let the search engine know which URL is the original (and often times only URL indexed) source of the content.

SEOMoz.org also suggests that the rel=canonical tag be utilized on each page of your website, even if you don't have a duplicate page, in case of future developments on your site that might cause a duplicate content issue.

How Do I Use the New Feature?

As Phillip and I have collaborated on this feature, we tried to make it as easy and straight forward as possible from an administrative perspective. If your website will be using Exponent CMS version 2.2.0 or newer, you'll find the Canonical URL field on any content page configuration under the “SEO” tab.

Exponent CMS Canonical URL Page Configuration

You'll also be able to find this Canonical URL field on the Exponent CMS blog, news, and ecommerce modules when adding or editing a post or product.

If you do not manually assign a Canonical URL within this field, the <link rel=”canonical”> tag will default to the SEF URL for that particular page/post/product.

In order to manually set a Canonical URL for a piece of content, simply type or paste in the FULL URL that you want to assign the canonical tag to.

What Does the Canonical URL Markup Look Like?

The canonical URL tag, whether you assign it manually or let it default automatically, will show up in the header tag of your Exponent CMS website, directly under the meta description tag:

Exponent CMS Rel=Canonical URL Markup

What if My Version of Exponent Doesn't Have the New Canonical URL Field?

If your website's version of Exponent CMS isn't the latest and greatest and you don't want to spend the time upgrading your theme in order to implement this new feature, Phillip Ball has come up with a work around that you can drop right into the header your site's theme.

However, because you should be assigning Canonical URLs on a page by page basis to eradicate duplicate content issues, this work around is not an ideal solution if duplicate content is what you're trying to fix. If you simply want to assign a Canonical URL tag to your web pages because it's a “SEO best practice” for pages not at risk of duplicate content, here's what you need to do.

Navigate into the backed files of your website, accessing the theme folder and adding this code snippet inside the header tag of your default theme and any subthemes you might have for your site:

 <link rel="canonical" href="<?php echo "http://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]" ?>"/>

Here's what that looks like in the theme file:

Exponent CMS Canonical URL Workaround

While not ideal, this relatively easy process will automatically add a rel=canonical tag on each of your web pages.

About the author

Atlanta SEO Consultant Chris J. EverettChris Everett is a SEO consultant and founder of Captivate Search Marketing in Atlanta, GA.

Chris has been a core contributor to the Exponent CMS open source project since 2008.

If you have any questions about rel=canonical tags or how to make your Exponent CMS site more SEO friendly, feel free to drop him a line on Google+.

v2.2.0...Is it worth the upgrade?

Since v2.2.0 is classified a 'major update' to Exponent, you may be hesitant to consider upgrading your sites.  Although in reality it is simply the next incremental version update, it does mark a milestone in the maturity of the Exponent 2.0 code.  Here are some immediate and long term benefits to updating to version 2.2.0 once the stable version is released in the near future:

  1. As always, a new version means many issues (bugs) have been fixed, and many new features will have been added.
    • For example, as web browser versions are updated more often than ever, an Exponent web site will now offer features to take advantage of new browsers and devices (e.g., html5 forms)
    • There is also a new html5 media player which will work on non-Flash enabled devices, unlike the Flowplayer module.
    • We've also put a lot of work into getting the e-Commerce module(s) working out-of-the-box, including a new sample store database which can be included during installation.  We've especially polished the event registration and donations modules.
    • There are also some new views for the blog module which now offers optional category support.  Additionally, there is a new sample blog database available during installation which automatically creates a new wp-like site.
  2. Once you've gotten your custom theme over the 'v2.2.0 hump,' there shouldn't be any custom theme changes required for future updates since we'll have finally eliminated all of the old 1.0 code.
    • Since the initial release of v2.0.0, a couple version updates have required custom themes be updated to continue working.  This was primarily due to the deprecation and replacement of old 1.0 code or modules needed for that original release.  Therefore, since all the old 1.0 code has been removed in the v2.2.0 release, we don't anticipate any major format changes which would require a custom theme update to work with future releases.

We anticipate releasing a stable v2.2.0 by the end of May 2013.

3 Web Presence Optimization Tips Using Exponent CMS

Web presence optimization is a more holistic strategy of online brand building. Although SEO is central to building a strong web presence in search, social media and content marketing are two additional elements that play big roles growing your brand's web presence.

Exponent CMS is well-suited for web presence optimization in that it caters to certain needs to execute a cohesive strategy. Below are three ways in which you can leverage Exponent for web presence optimization.

1. Integrate Social Media Icons

social web presence optimizationWithout question, social media can have a momentous impact on your brand's web presence optimization strategy. "Social signals," (such as Tweets, Facebook Likes, Shares, Pins, and Google +1's) are becoming strong ranking factors for search. For this reason, it's a smart to include social media icons on the pages of your site with social and SEO value (e.g. blog posts.)

The social media marketing component of your brand's web presence optimization strategy will coincide with content marketing (mentioned below) and search engine optimization. This is because most of the content that you create will be shared and promoted via social media. As a result, you can better engage with your target audience and inbound direct traffic to your Exponent site.

2. Create a Blog for Content Marketing

Content marketing is a powerful portal to expand your web presence and make your voice known. Blogging is one of the easiest ways to start content marketing. By created awesome content and sharing it with your social media followers, you can direct quality traffic (and in-market leads) to your website.

Exponent makes it easy to build a blog on your website. Here you can take web presence optimization to the next level by publishing articles, videos, and other forms of engaging content. You can the leverage this content for both SEO and social media marketing.

3. Keyword Optimize Your Pages for SEO

The last web presence optimization tip focuses on SEO - which offers amazing potential to expand your web presence and increase web traffic. The nice thing about Exponent is that it's well-suited to easily keyword optimize the pages of your website. keyword web presence optimization

The fields that you'll want to ensure are keyword optimized for SEO are the:

  • SEF Name (or URL of the page)
  • Page Title (also known as the "Meta Title")
  • Keywords
  • Page Description (also known as the "Meta Description")

All of these fields can be found by click the "Pages" button on the blue column bar (when logged in to Exponent,) and then selecting "Edit This Page."

This keyword optimization is essential for SEO and establishing relevancy on your pages. As a result, you can maximize your SEO and web presence optimization potential.

3 Ways Exponent Makes Essential Web Design Elements SEO-Friendly

By now, you should be well aware that Exponent is one of the most SEO friendly CMS platforms available for free on the web. Professional web designers love Exponent because it automatically makes a number of web design elements and tasks SEO friendly. This can offer a number of efficiencies for SEO-conscious web designers and developers. SEO Friendly Web Design

If a SEO-friendly web design is priority for your website, then consider the follow three ways in which the Exponent CMS makes certain web design elements SEO friendly.

1. SEO Friendly Web Content

Certain tags that define web content are more SEO friendly than others. For example, the strong tag is considered more SEO friendly then the bold tag, although it performs the same function. This helps search engine spiders crawl and index a page for greater keyword relevancy and on-site SEO authority.

Exponent has been developed with SEO as a top priority. As a result, tags that define content are all defaulted to represent SEO best practices. This makes it easy for add optimized content to a page without having to open-up the website's backend.

2. Social Media Integration Made Ease

A truly SEO friendly web design will have social touch points integrated and easily visible. This touch points may be as simple as social sharing widgets for blog posts, or site-wide social icons to promote for Facebook or Google Plus followers.

With Exponent, you can easily integrate social meda on your web design. In addition to help growing your social media following, this can encourage "likes, tweets, +1's, etc" (or social signals) that can influence your pages' rankings.

3. SEO Friendly Media Elements

Aside from text, media elements like images and videos can either help or hinder SEO performance. Skilled web designers can optimize robust media files so they do not stand in the way of SEO. However with Exponent, this process is made more efficient.

Media files can be easily adjusted and keyword optimized directly via the CMS editor interface. Users can adjust the sizing, image Alt tag, linking, and other attributes on the fly.

Interested in learn more about SEO friendly web design? Check out the SEO Friendly Web Design blog for related tips and insights. Or scope YisooTraining.com for Internet marketing courses and online training courses.

Using Graphics and Files in Exponent Part #2

Recently I had written an article on using graphics and files which was common to most modules using either the WYSIWYG editor or as 'attached' files.  In this article I want to explore how to take advantage of the unique features of each module based on their designed purpose.  Again, you can use the text module to mimic the output from most of the other modules, but why not 'use the right tool for the job'

We'll start with the 'News' module.  The strengths of the news module are: each news item has a publish and an optional unpublish date, meaning the first date to display and the last date to display.  Also the items can be sorted several different ways by date in addition to manually (by rank).  You may also set the priority of the item by 'featuring it'.  A featured item will displayed in all views, where if not featured it may be hidden on some displays if the 'show featured' setting is on.  You may also publish the news items as an rss news feed or pull another rss news feed into the news module to be displayed as news items.  News modules may also have user subscriptions using the optional E-Alert feature.  Additionally, the a news item may be tagged so it can be associated with other similar news and non-news items based on the keyword tag(s).  Therefore the 'News' module is best suited for news or announcement type information.

In some ways, the 'Blog' module is like the news module on steroids.  It allows user comments on blog items and optionally allows groupings by category.  It has a 'draft' feature where the article will only be visible to the editor or administrator until published.  Unlike a news item, a blog item/article does not have an unpublish date, is only sorted by publish date, and doesn't pull in external rss feeds.  As it title suggests, the 'Blog' module is best suited for managing articles or web logs (blogs).

The 'File Downloads' module is very versatile, especially when contrasted with the blog module.  It deals with 'attached' file directly instead of the system generic method.  In addition to the attached file, you can attach a 'preview' image to be displayed on the site, or point the download to an external link.  It can optionally publish it's items as a Podcast.  It can optionally display attached media files using a media viewer to play the audio/video within the item.  It does not proved the user subscription feature.  If you need to provide file downloads or a Podcast, the 'File Downloads' module is your best bet.

The 'Portfolio' module deals with lists of data.  It does not store publish dates but can be ordered either manually or alphabetically.  It also provides a 'feature this' option.  It does not allow comments nor provide an rss feed option.  The 'Portfolio' module is best suited for directories or other lists of information.

The 'Photo Album' module deals with photos or images.  Its views focus on the attached image rather than the title and description, such as the gallery or slideshow views.  In addition to being sorted manually, photo items may be displayed randomly.  It also deals directly with an image file, meaning one photo item per image.  It should go without saying, but the 'Photo Album' module is bested suited for photos and images.

The 'Flowplayer', 'YouTube', and 'Media Player' (new to v2.2) deals with audio and video files.  While the 'file download' module can provide some features, the focus on these modules is displaying the media by playing it on the web site.  It provides greater control over the actual display of the media player being used.  These modules are best suited for display media on your site.  The 'Media Player' replaces both the 'Flowplayer' and 'YouTube' modules primarily because it can handle both types of media and is HTML5 compliant (Flash is not required)

Hopefully this article has provided some insight on choosing the best module for the task at hand.  I'll plan to write a follow up article on some of the more unique modules.

Successful Site Upgrade Strategies

Exponent is a very active project and frequently receives new features.  Issues or anomalies are also corrected shortly after being identified.  You'd think those would be great incentives to update to the most recent stable version, just to make managing and maintaining a web site much easier.  Here are some tips to help in upgrading a site, or to prepare to upgrade a site.

As a quick overview, an Exponent web site consists of five (5) components:

  1. the Exponent software, which gives you an empty site and is the starting place for all sites whether being built from scratch, moved to a new server, or restored after a server failure. This is the part of the update that we provide for you.
  2. the custom theme, which gives your site a unique character apart from all other web sites.  While we provide some sample themes (either in the package or additional ones on the download site), most users want to customize their own theme.  The user must maintain (update?) the custom theme and ensure it does not contain obsolete commands or calls.  It is stored/contained in the '/themes' folder.
  3. the site's configuration settings, which hold the basic information about the site.  It is stored in the 'config.php' file which is created and updated by the Exponent software.  It is unique to each web server.
  4. the site's content, which is the majority all you see on the web site.  This is stored in the database and is updated automatically during the 'upgrade' process.
  5. the site's support files, which includes all the images used on the site, and any files made available though the site.  These are stored in the '/files' folder and are not affected by upgrades.

The first step in preparing to upgrade a site (and preventing disaster in general), is always maintain a BACK UP of your site.  In order to back up the five (5) components:

  1. The Exponent software is always available on Sourceforge and through GitHub, so there's no need to keep a local copy.
  2. The custom theme was created by you and in most cases you'll already maintain a copy.  However in v2.2.0+, there is a new 'Export Theme' command available in the Theme Manager to easily package and download your custom theme for restoration, or to move to a new site.  The theme may be restored/added to a site using the 'Install Extension' command.
  3. The 'config.php' file is located in the '/conf' folder (v2.0/2.1) or the '/framework/conf' folder (v2.2).  The easiest way to quickly get 'back up and running' is to restore a copy of the config.php file.  For security reasons Exponent provides no automated method to retrieve nor restore the config.php file.  However, we highly recommend you use cPanel or ftp to obtain a copy.
  4. The site's content (database) is easily saved or restored using the Import/Export EQL (Exponent Query Language) File commands. The export command allows you to tailor which information/tables are saved, while the import command replaces any database tables with the ones stored in the EQL file.
  5. Lastly, the site's support files are easily saved using the Import/Export Files commands.

So once you have a backup of your site, especially the site's content (EQL file), you may proceed.

In a very simplistic sense, upgrading to a new version of Exponent is an easy two (2) step process.

  1. Install the new software version on your server by either extracting the .zip file to the root folder/subfolder, or using 'git pull' from ssh or a shell.
  2. Browse to your site and follow the instructions in the 'upgrade' notice which now appears.

That sounds so simple, what could go wrong?  Well, here are some common issues or problems which might prevent a smooth upgrade:

  • Your custom theme (or a custom view) is outdated and uses obsolete commands.  Though the basic format of an Exponent theme hasn't changed much from the v0.9x days, many of the 'commands' have been updated and streamlined.  Here's the documentation on the theme template format to check/update your theme.  Here's a good article on checking for and updating themes to be v2.2.0+ compliant.  As we move into version 2.2.0+, many of the obsolete calls will no longer work.  The easiest way to confirm the problem lies in the custom theme is to switch your site to a 'shipped' theme and see if it works as expected.  If for some reason you can't log onto the site, the current theme is stored in the 'config.php' file on the line with DISPLAY_THEME_REAL.
  • Your site crashed in the middle of an upgrade and now is 'broken'.  While this rarely occurs with the 'stable' software, it can exist after a test with pre-release software.  Your best bet is to run the upgrade again by manually kicking it off with a browse to your site via www.yoursite.org/install/index.php.  In many cases this will detect and correct a half-upgraded site which may also correct the issue.

While we realize that many Exponent users are actually providing a paid service to clients and their 'time is money.'  Therefore, if a site is up and running, why 'donate' your valuable time to a paying customer.  However, if YOU are the one doing most of the site content, it sure helps to have access to the 'user suggested' new features and have those annoying quirks and bugs fixed.

Using Graphics and Files in Exponent

Though Exponent is designed to be 'easy to use' and 'flexible', sometimes the overlap of features between modules can make it  seem a bit complex.  Most modules allow you to display text and graphics, however each module is different in how content is displayed (how it appears to the user and acts as a web page) or administered.(managing and updating the content such as editing).  In this article I'll attempt to show the various features and limitations available to help you determine which is right for your particlular application.

The easiest method to display content on a page is to use a 'text' module. In fact you can mimic the content of most of other modules using a single text module if you're willing to do a lot of work to manually manage it.  In it's default state a text module item simply has a title and WYSIWYG (what you see is what you get) content.  However, you can optionally add file attachments using the module configuration settings 'Files' tab.  First let's look at how we can use graphics and files in the WYSIWYG content.

The WYSIWYG editor allows you to insert insert graphics and links in the content.  To insert a graphic into the text, click on the 'Image' icon (looks like a landscape picture).  In the 'Image Properties' dialog which appears, the 'Image Info' tab determines which graphic will be used and how it will appear in the text.  You can either type in the url to the graphic, or use the 'Browse Server' button to open the File Manager.  Once you've selected a graphic, the File Manager will close itself and the graphic will appear in the 'Preview' pane of the Image Properties dialog.  You can adjust the graphics appearance by using the settings to the left of the Preview and evaluate the results in the Preview pane.

The WYSIWYG editor Image Properties dialog also allows you to assign a link to the graphic when it is clicked.  Using the 'Link' tab you can enter a url to be sent to, or use the 'Browse Server' button to bring up the 'Insert/Modify Link' Manager.  This window allows you to easily select from any of the pages on the site in either the 'hierarchy' or as a 'standalone page' which returns you to the Image Properties dialog.  You may also link to a specific module on a page by using the 'Click Here to Link to Content' link in the top center.  This will bring up a copy of the web site, but you'll notice that all the 'chrome' menu bars now have replace the module menu with 'module type - Link to This Module'.  Browse to the desired page and click on the 'module type - Link to This Module' to select it and be returned to the 'Insert/Modify Link' Manager, where you can click the 'OK' button to return to the Image Properties dialog.  Or you may link to a file by clicking on the 'Switch to File Manager' link in the upper right corner of the 'Insert/Modify Link' Manager.  You may also select how the 'link' opens when clicked by selecting a 'Target' in the 'Links' tab of the Image Properties dialog.  Click OK, to place the image in the text.  You may manage existing graphics by dragging them around, or right-click to bring up a menu to change link or graphic settings.  As you can see, there is a limited amount of flexibility even at this point.  

However, let's say you want to associate graphics with the content, not necessarily embed them within it.  You can attach files to the text item  by turning this feature on using the 'Files' tab in the module Configuration Settings dialog.  This will activate an area below the WYWSIWYG editor to select and attach up to 10 files.  You can delete or rearrange the attached files using this same area.  The default setting on the 'Files' tab is 'This module does not use files' however you can attach files by selecting one of four display styles: Downloadable Files, Gallery, Showcase, Slideshow:

All four display styles allow you to set the Display Box.  You can adjust the 'box' placement (above, left, right, or below the content), its width, and its margin.  Exponent does its best to display the attached files within the display box and wraps the item content around it.  Any thumbnails will wrap within the display box, so if you do not set a display box width, you'll see a column of thumbnails.

  • Downloadable Files displays a list of all attached files as names with links to download the file.    For the Downloadable Files, you may also set the Title above the list.
  • Gallery is used to display one or more graphics with an optional 'lightbox' display.  You may select to only display the primary or first image on a listing or showall view, with all images displayed on an item or show view.  You can set the size of the thumbnails and their placement in relation to the primary image.
  • Showcase is used to display one or more graphics with a larger version of the current/selected graphic.  This also can be set to only display the pimary image on a listing page.  You can also set the action to display the thumbnail in the larger graphic by either a click or hover.
  • Slideshow is used to display a set of graphics as a slideshow.  And in v2.2+ you may optionally display the slide title and/or slideshow controls.

This has been a preliminary introduction to files and graphics in Exponent.  I plan to write another article to pick up on some module specific features dealing with files and graphics.