5 New Features in datAvenger 5.0

As we’ve been covering over the last week, we’re launching datAvenger Pro 5, the latest version of our advanced content management system, within the next few weeks. Before we launch, though, we wanted to give you a sneak peek at some of the great new features in this version.

Dramatically improved drag-and-drop form creation

Companies who use datAvenger Pro have told us they love our easy-to-use, drag-and-drop form editor. It eliminates the difficult process of building forms; instead, you pick the field type you’d like to add, drag it into the big form area, and your form is ready to go.

We’ve heard that datAvenger Pro users would love to be able to add more than one field per line in order to keep forms compact and less rigid. datAvenger Pro 5′s form module does just that: you can now add as many fields per line as you like.

Content stats for every page

When you first go to edit a page, sometimes you want an at-a-glance look at what’s contained on that page. In dA Pro 5, not only will you be able to see a preview of every page’s content, but you’ll also see a count of the number of words, fields, or submissions for every page. We hope these small tweaks will allow you to see a better picture of your site.

The best URLs yet

datAvenger Pro has supported search engine friendly page addresses since we launched version 4 in 2006. A normal version 4 address would look something like this:

http://www.example.com/content/4052/Visit_Our_Store/

We decided to step it up a bit by making page addresses in dA Pro 5 even easier to read — and even better for search engines. When you’re editing a page in dA Pro 5, there’s a new option to create a custom URL that’ll look like this:

http://www.example.com/visit-our-store

At Sephone we’re committed to creating the best experience possible for your site’s visitors. We also do everything we can to stay on top of the latest guidance from search engines to make sure you’re a step above your competition. That’s why we’ve constantly refined page URLs in both datAvenger Pro and our basic content manager, datAvenger.

Easy sharing on Facebook and other social networks

datAvenger Pro 4 allowed you to specify what keywords and description you’d like to include in the metadata for each page. In version 5, we’ve added the option to add an image. This is perfect for those times when people share your site’s pages on sites like Facebook, allowing you to add an eye-catching graphic into feeds on social networks.

An asset manager made with you in mind

datAvenger Pro 5 assets area

Personally, my favorite new feature of datAvenger Pro 5 is our new assets area. Assets are all the stuff you upload to your site: images, documents, and media. Our new assets area is filterable by content type. It’s searchable by keyword. It’s sortable by name or upload date. It allows tags to find your assets even faster. It includes thumbnails of images right in the asset list. And best of all: we’ve included drag-and-drop uploading for Firefox, Chrome, and Safari users. That’s right: all you need to do to upload files to your site is to drag them from a folder on your computer onto the assets list in your datAvenger admin area. Simple as that!

Version 5 is a huge new release of datAvenger Pro, and we’re really excited about all the new functionality we’ve been able to include. If you’d like more information about when you can upgrade your dA Pro site to version 5 – or if you’d like to know more about moving your site to datAvenger – we’d be happy to talk with you!

datAvenger is a product of Sephone Interactive Media

datAvenger 5 New Features

As we’ve been covering over the last week, we’re launching datAvenger Pro 5, the latest version of our advanced content management system, within the next few weeks. Before we launch, though, we wanted to give you a sneak peek at some of the great new features in this version.

The best URLs yet

datAvenger Pro has supported search engine friendly page addresses since we launched version 4 in 2006. A normal version 4 address would look something like this:

http://www.example.com/content/4052/Visit_Our_Store/

We decided to step it up a bit by making page addresses in dA Pro 5 even easier to read — and even better for search engines. When you’re editing a page in dA Pro 5, there’s a new option to create a custom URL that’ll look like this:

http://www.example.com/visit-our-store

At Sephone we’re committed to creating the best experience possible for your site’s visitors. We also do everything we can to stay on top of the latest guidance from search engines to make sure you’re a step above your competition. That’s why we’ve constantly refined page URLs in both datAvenger Pro and our basic content manager, datAvenger.

Dramatically improved drag-and-drop form creation

Companies who use datAvenger Pro have told us they love our easy-to-use, drag-and-drop form editor. It eliminates the difficult process of building forms; instead, you pick the field type you’d like to add, drag it into the big form area, and your form is ready to go.

We’ve heard that datAvenger Pro users would love to be able to add more than one field per line in order to keep forms compact and less rigid. datAvenger Pro 5′s form module does just that: you can now add as many fields per line as you like.

Easy sharing on Facebook and other social networks

datAvenger Pro 4 allowed you to specify what keywords and description you’d like to include in the metadata for each page. In version 5, we’ve added the option to add an image. This is perfect for those times when people share your site’s pages on sites like Facebook, allowing you to add an eye-catching graphic into feeds on social networks.

Content stats for every page

When you first go to edit a page, sometimes you want an at-a-glance look at what’s contained on that page. In dA Pro 5, not only will you be able to see a preview of every page’s content, but you’ll also see a count of the number of words, fields, or submissions for every page. We hope these small tweaks will allow you to see a better picture of your site.

An asset manager made with you in mind

datAvenger Pro 5 assets area

Personally, my favorite new feature of datAvenger Pro 5 is our new assets area. Assets are all the stuff you upload to your site: images, documents, and media. Our new assets area is filterable by content type. It’s searchable by keyword. It’s sortable by name or upload date. It allows tags to find your assets even faster. It includes thumbnails of images right in the asset list. And best of all: we’ve included drag-and-drop uploading for Firefox, Chrome, and Safari users. That’s right: all you need to do to upload files to your site is to drag them from a folder on your computer onto the assets list in your datAvenger admin area. Simple as that!

Version 5 is a huge new release of datAvenger Pro, and we’re really excited about all the new functionality we’ve been able to include. If you’d like more information about when you can upgrade your dA Pro site to version 5 – or if you’d like to know more about moving your site to datAvenger – we’d be happy to talk with you!

datAvenger is product of Sephone Interactive Media.

Adding and Managing Links with datAvenger

Adding links is simple with datAvenger and datAvenger Pro.  You can link both text and images on a page, and can link to just about anything that lives on the web today.

If you want to link some text to something just add the text to your page, and highlight it.  Then click the insert web link icon in the toolbar, it looks like a world with a link over it.  Then fill in the appropriate areas for the link you want to create in the window that comes up.  The options you have are:

  • URL: is for adding a link to an external website, a site that does not http://www.yourwebsite.com.  You will need to include the entire url including the http:// part for this link to work.
  • Page or Page on site: is for linking to a page you have already created on your site.  Just select the page from the drop down.
  • Anchor on page: is to link to an anchor that exists on your page.  You will need to create the anchor before you can link to it.  This feature is only available in datAvenger service.
  • Asset: lets you link to an uploaded asset from your site.  If you have not yet uploaded the asset you want to link to click the upload a new asset link and follow the steps to upload the new asset.
  • Email address: lets you link to someone’s email.  Just put the email address in here and whenever someone clicks the link it will compose a new email to that address.
  • Title (tooltip): is like help text.  This is what shows up next to the mouse when someone hovers over your link.  If you are going to use this it is good to put the url that you are sending people to or the site name.
  • Target: tells the browser how to open this link.  The main 2 you should use are none, and new window.  None will open the link in the same window/tab you are in, and new window will open the link in a new window/tab so that if a user closes the link tab it will bring them back to your site.  Use the new window option when you are linking to external websites.

To link and image to something the process is relatively the same, but instead of highlighting the image you just need to click on it so that you see the bounding boxes around the edge of the image, then click the insert web link icon in the toolbar and everything else is the same.

To edit a link that has already been created you can click the link and then right click and select modify link from the menu, or click the link and click the insert web link icon in the tool bar.

That is pretty much all there is to links in datAvenger.  Fell free to let us know if you have any questions.  To learn more about how you can use datAvenger and datAvenger Pro check out our other tutorial videos.

datAvenger Service does Analytics

Did you know that the lastest version of datAvenger Service has Google Analytics support to help you track site visitors and see trends of what’s happening on your site, and the best part is it’s super easy to setup.  To start you need to go to google.com/analytics and setup the analytics account.  Once you have setup the analytics account, you need to get the code to put on your site: it usually looks like this:

<br />
<br />
var _gaq = _gaq || [];<br />
_gaq.push(['_setAccount', 'UA-xxxxxxx-x');<br />
_gaq.push(['_trackPageview']);</p>
<p>(function() {<br />
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;<br />
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : http://www') + '.google-analytics.com/ga.js';<br />
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);<br />
})();<br />
<br />

You can find it in your Google Analytics Control Panel. Follow these screenshots:
Click the settings icon on the right side of the dashboard navigation bar.

Click Tracking Code tab

Copy Code from step 2 on this page

Now that you have the tracking code go into your datAvenger service admin area. Click the setting tab, then click tools, and paste your Google Analytics code into the box provided for Google Analytics. Click save and now your site will track the user’s behavior while on they are visiting the site.

5 questions to ask when comparing CMS options

We’ve shown that having a content management system for your site is important. But there are a number of content management systems available for use on sites. Web development companies usually pick one or two they like best; they might develop their own (for example, we built a CMS called datAvenger at Sephone), or they may choose to use an open-source CMS to power the sites they make.

But what should you compare if you’re looking at a few CMS options? Here are five questions to ask.

Is it hard to learn how to edit my site?

If you make a lot of changes to your site (or even if you don’t), the most important piece of the CMS puzzle is feeling comfortable with the area where you edit your site. If it’s a hassle or burden to find the page you want to change, wrangle with an editor, and then stumble to push the page to the live site, you’ll find yourself frustrated – fast.

If, on the other hand, editing makes sense and is easy to do, you can have an up-to-date site that changes whenever you like. There’s no reason why a simple content change on your site should take more than a few minutes. Don’t compromise on a CMS that makes you do more work.

Will my site play nice with search engines?

It’s important that people can find your site on the web. Search engine optimization (or SEO) isn’t all about the content on your site; it’s also about how your site itself is built. A good CMS can help your site shine on search engines.

A good first check is to see how the page addresses (known as URLs) look for your site. Many older content management systems use a combination of codes and ID numbers in the URLs for every page:

http://www.example.com/index.php?pageId=25&section=5
http://www.example.com/directory.php?dirId=25&person=52&view=standard

These kinds of URLs are tough for search engines to understand because they don’t say anything about what’s on the actual page. Look for a CMS that builds URLs using the title of the page, or another set of keywords you can customize:

http://www.example.com/about-us
http://www.example.com/directory/person/jim-smith

These make it easier for both search engines and your visitors to remember your site.

Bonus tip: Ask how a site’s CMS handles mistyped or broken links. In the tech world, we call these 404s. Ideally a CMS should show a screen that tells your visitor that the page is not available. It should also send a special server status code (a 404) so that search engines and other sites can tell that the page doesn’t exist. This helps search engines remove a page from their results after you delete it from your site.

What kinds of content can I have on my site?

Form moduleAs we mentioned in our “What is a CMS?” post, most content management systems allow you to edit text in a rich text editor. This allows you to style text, add links and images, and more. Chances are, though, that your site isn’t only text. What if you want to add a form for visitors to fill out, an image gallery, or a widget from another site? Make sure that the CMS you choose can support the kinds of content you need (or can be customized to adapt to what your site needs to do).

Can I preview my changes before everyone sees them?

The administration area for some content management systems allows you to see how the changes you make will look on your site before you publish them to your live site. This is a great feature if you’d like to be able to tweak what you write before the world can see it.

Bonus tip: See if your CMS saves drafts as you work. If your browser or computer crashes, you don’t want to lose all of your changes!

Are pages for my site ready to be shared on social networks?

A link shared on FacebookFacebook and Twitter make it super simple to share links. Will the pages you share look their best, though? Facebook, for example, lets pages choose what they want for a description and image of a page when it’s shared. Check to see if your CMS can control how this looks instead of posting just the first few words from the page (or just the page title with no text at all).

These five questions are a good starting point when you start to compare your CMS options. If you’d like to know more about how content management systems can help your site, read more on our blog or get in touch with us!

datAvenger is a product of Sephone Interactive Media.

What is a content management system?

We all know how important it is for your business or organization to have a presence online. When you first decide to set up your site – or when you decide to make a change in how the site is run – one of the most critical decisions you can make is whether the site will use a content management system (CMS).

A content management system allows you to make changes to your own site, even if you have little technical knowhow. Instead of calling up a developer every time you’d like to change some text, rates, or a phone number on your site, a CMS lets you log into an administration area with a username and password and make the change in an editor. Once you’ve made the changes, they’ll appear instantly on your site.

Features of most content management systems

Content management system editor

Content management systems often feature rich text editors that allow you to style the text of your pages.

Most content management systems allow you to do a number of common tasks on your site.

  • Adding and removing pages
  • Editing pages in a WYSIWYG editor
  • Inserting links and images on pages
  • Customizing page titles and addresses

Reasons to use a CMS

There are a number of reasons why content management systems make a lot of sense for businesses.

  • Save money: Instead of paying a web developer every time you want to change your site, you can make edits whenever you like.
  • Save time: The changes you make in a CMS are published instantly; there’s no waiting hours (or days) for a change to be done.
  • Stay in control: A CMS lets you have complete control of what’s on your site. If you want to add or remove a page, or if you’d like to change some text, it’s easy to do!

We’re about to release the latest version of our own advanced CMS, datAvenger Pro. Over the next couple of weeks we’ll feature more posts about content management and how to make the most of your site!

Editing your datAvenger Service website

With datAvenger it is easy to update and make changes to your site. To start you first need to login to your datAvenger admin area, by going to yourdomain/admin.

Once you are logged in, to edit a page you will need to click the page that you want to edit. This will open up the editing window, where you can make any of the necessary changes to the content of that page. From here you will have the editing toolbar at the top of the window and the content area below that. Usually this content area is a large white box, but in some cases can be a different color based on your sites background color.

To start editing you need to first click inside the content area, this will activate the editing window, and the toolbar. Once you have done that you can highlight, change and edit anything in the content area.

Now that you know how to activate the content area, lets take a few minutes to go over the editing options in the toolbar.

  • format – here you have options for headings 1-6, normal, address and formatted.
    • Headings 1-6 allow you to set up a content hierarchy for the content on your page. In most cases we use the Heading 1 for the title on the page, so it is best to skip this heading and start with Heading 2. You would use these to setup titles for sections of your content. For instance the page title would be a heading 2 and sub categories/titles would follow suite with headings 3-6.
    • Normal formats your text to look like the normal text on your website.
    • Address by default is going to format text to be italicized. This setting is customizable but is something that we have to customize for you if you would like to change it.
    • Formatted is going to display the text set to formatted exactly as you type it, including all spaces and line breaks.
  • Font – allows you to set the font of the selected text to any given font in the list.
  • Size – allows you to set the size of the selected text to any given size in the the list.
  • Bold – Allows you bold the selected text
  • Italics – Allows you to italicize the selected text
  • Font Color – Allows you to change the color of the selected text. There is an array of colors to choose from, and you can slide the handle to the right up and down to change the shade of the colors. Also once you have selected your color, you will need to click ok to apply it to the selected text.
  • Justification – Allows you to set the justification of the highlighted text. You have the options for left, right, center and fully justified.
  • Undo/Redo – Allow you undo and redo something that has been done.
  • Numbered/Bulleted List – Allow you to create numbered and bulleted lists out of the text on your site.

The next icons are more of the web based icons and will allow you to add links, images, and tables to your pages.

  • Insert Web Link – This allows you to change the highlighted text or selected image into a link.
    • URL – Lets you set the link destination to be an external website, or a page that does not exist on your site.
    • Page – Lets you set the link destination to be a page on your site. Simply select the page that you want to link to from the drop down.
    • Anchor on Page – Allows you to set the link destination to be an anchor that exists on this page. I will go over anchors in detail with the next toolbar icon.
    • Asset – Lets you link the selected text/image to an assets that you have uploaded to the site. This can be an image or a document. If you want to link to an asset that you have not yet uploaded you can click the upload an new asset link in this window and follow the steps to upload the asset you want to link to.
    • Email address – Allows you to link the highlighted text to an email address so that if someone clicks on the link it will allow them to compose a new email to that address.
    • Title (tooltip) – is what will show up next to the mouse when someone hovers over the link you are creating. A good example of some to add here would be the title of the page you are sending people to, or if it is an external link the url you are sending them to.
    • Target – determines how the link you are creating will open. You have the following options under target:
      • none – which will open the link in the same window/tab you are in now.
      • new window – will open the link in a new tab or new window depending on your browser settings.
      • same frame – will open up the link in the same frame that the link is in – use this option only if you are using frames on your page.
      • top frame – will open the link in the top frame of the site, this will function much link the none option will. Use this option only if you are using frames on your page.
      • other – allows you to specify a specific location for the link to open.

    once you have changed all of the options for you link, click okay, and this will create the link for you.

  • Anchor – This allows you to create an anchor on the page you are on. An anchor can best be described as a jump to point on the page. When you click this icon a new window will open allowing you to give a now to your anchor. When naming your anchor make sure to use no spaces to ensure it works correctly, so use dashes (-), underscores (_) or just no spaces. Once you have named your anchor you can highlight the text you want to link to it, and click the insert web link icon where you will be able to select your anchor for the anchor on page drop down.
  • Insert/Modify Image – allows you to insert a new image or modify an existing image on your page.
    • Image URL – allows you to place an image from another website on your site. You will need to put the URL for that image in the box provided for datAvenger to know where to pull the image from.
    • Preview – allows you to preview the image that you select from the assets drop down or put in the image URL box. This preview will show up at the bottom of the Insert/Modify Image window.
    • Asset – allows you to select an image that you have uploaded to assets to display on the page. If you have not yet uploaded the asset you want to use, you can click the upload a new asset link and follow the steps to upload the new asset, then you can select if from the drop down.
    • Alternative Text – This is a short description of your image, that servers several purposes. The first is for search engines, as they cannot read images (yet), the alternative text will tell the search engine what the image is about. Second is for screen readers. These are used for a variety of reasons but one of the most common is for visually disabled people and the alternative text will tell the screen reader what the image is, the screen reader will read outloud what you put for alternative text. Lastly the alternative text is what will show up if for some reason your image does not load, so that people know what is supposed to be there. Usually if you have text in your image it is best to add this text to the alternative text field.
    • Layout – gives you some control over how this image is going to display relative to the text around it.
      • Alignment – lets you set how this image will align relative to the text around it.
      • Border Thinkness – lets you set a border around the image. If you do not want a border make sure to set this value to 0 as some browsers will add a border by default.
    • Spacing – controls the spacing around the image, both horizontal and vertical.

    Once you have made all of the necessary changes in this window to display your image click okay.

  • Insert Table – use this icon to insert a table into your page. Tables generally should only be used for tabular data or to have items show up next to each other. There are more table options than what appear in this window, and I will go over these in another video.
    • Rows / Columns – lets you set the number of rows and columns you will have in your table. Rows go down and columns going across the page.
    • Width – allows you to set the width of the table in percent, pixels or ems, all of which are web measurements. Percent will set that table to be that percentage across your page, this is flexible depending on page size. Pixels will set the width to be that exact amount of pixels, and EMs will set the width to me the exact number of ems you specify.
    • Fixed width columns – is going to set each column to be the same width evenly over your table, by percent. So if you have a 2 column table each column will be 50% wide.
    • Layout – Lets you set the layout options of the table.
      • Alignment – sets how the table will display relative to the text around it.
      • Border Width – lets you set a border width to the table. This border will show up around the edge of your table as well as between each row and column
    • Spacing – allows you to set the spacing between columns and rows and the text inside each cell. As a note, usually entering 5 in these boxes is a good place to start for spacing.
      • Cell Spacing – sets the spacing between each cell of the table in pixels
      • Cell Padding – sets the padding between the cell wall and the text inside the cell in pixels.

    Once you have changed all of the necessary settings for your table click okay to insert you table into your page.

  • Toggle Borders – By default in datAvenger (and most content management systems) if you have a table with a border of 0 then you will not be able to see the border of that table in the editor, and thus will not be able to see where to enter the data. By clicking the toggle borders toolbar icon you will activate a faint dashed line around the cells and borders of your table allowing you to see it’s boundries
  • Clean up HTML – Many times you will have the content that you want to use in another document outside of datAvenger. And you will want to copy and paste that content from that document into datAvenger. A lot of the time this will add extraneous code to your page and can cause problems for you down the line, as browsers do not know what to do with this code. That is where the Clean up HTML toolbar icon comes in handy. If you click that icon you will be presented with some options, check the options that apply to what you want to do and click ok, this will clean up the HTML with the specified options. An alternative to do this, is either paste your text into a text editor like notepad on a PC and text edit on a Mac, this will strip all of the styling out and allow you to style once in datAvenger, or you can just simply do everything in datAvenger and sytle as needed there.
  • Toggle HTML Source – This toolbar icon i used to view the source code for the page you are on. It is mainly for advanced users that have a prior knowledge of HTML and can edit it directly.

Please note that all measurements used in datAvenger are done in either pixels, percent, or ems. If there is not an option to change the measurement unit than it will be measured in pixels.