Archive for the ‘Content Management’ Category

« Older Entries
Newer Entries »

Advanced Content Management: Using AjaxIncludes, JSON feeds, and Texty together

Sunday, October 21st, 2007

Digging a little deeper, we find that Texty can even be used with more advanced features. Let me show you how to combine AjaxIncludes , JSON feeds from Zoho Creator , and Texty content management into a single powerful site-building tool.

First, you will want to use the AjaxIncludes scripts to build your site framework. Remember that these elements will not be indexed as part of your site, but that’s OK because they are just the design elements of your page. This can include items like your page banner, navigation structure, and a blank “block” for your page’s content. I’ll use the following assumptions in this example:

  • You are using Microsoft Office Live Basics (MOLB), so all of your files are stored in the same directory: http://yoursite.com/Documents/.
  • You have already saved a copy of the AjaxIncludes script from Dynamic Drive as a separate file in your site at http://yoursite.com/Documents/AjaxIncludes.txt (You don’t want to save files with the “.js” extension if you are using MOLB).
  • You have created the following files to provide the framework for your site:
    • banner.htm (The main banner for your page)
    • navigation.htm (The top navigation structure for your page)
    • footer.htm (The footer for your page)

With this structure in place, you are ready to build a blank page like this:

<html>

<head>

<title> Your Site Title </title>

<script type=”text/javascript” src=”AjaxIncludes.txt”></script>

</head>

<body>

<script>

ajaxincludes(“banner.htm”);

ajaxincludes(“navigation.htm”);

</script>

<script>

ajaxincludes(“footer.htm”);

</script>

</body>

</html>

Now, you have created a blank page template for your Web site with all of the background and navigation elements already in place. You are now ready to start building an advanced content management system to deliver the content to this page. This system includes two elements:

  1. Reading the parameters of your URL and matching your JSON feed to decide on the content to include
  2. Implementing the appropriate Texty script for the content chosen above, and displaying that content on your page

First, you will need a Zoho Creator application to build your JSON feed, and a Texty account with some content available. Your Zoho Creator application should have at least one field for the value you want to use in the URL, one field for the script code generated by Texty. Optionally, you can include a field for the page title (which will display in your browser window and/or the page tab). Here’s an example of some values you may want to use:

Value TextyCode Page title
Home <script type=”text/javascript” language=”javascript” src=”http://texty.com/cms/syndicate/ {Your unique URL} .js” ></script>
About <script type=”text/javascript” language=”javascript” src=”http://texty.com/cms/syndicate/ {Your unique URL} .js” ></script> About Texty: Simple Content Management and Syndication
Contact <script type=”text/javascript” language=”javascript” src=”http://texty.com/cms/syndicate/ {Your unique URL} .js”></script>
Contact Us to learn more about Texty!

The Texty scripts I have included here are for sample purposes only and will not work. Use your own values, which are provided to you whenever you create or edit a Texty, or when you click on the “Copy Texty” button next to one of the Texty’s available in your account. The values field should be either number or a short description (ideally without spaces or special characters, which will be corrupted by the Web browser). Keep your values short, easy to remember, and only one word long.

Now that you have your Zoho Creator database built, you can expand on it every time you write a new Texty. Just copy the Texty code generated and drop it into the texty script field. Assign a name or number for the “value” field and, optionally, a page title.

Next, you want to update your Web page to be able to read the values from your database by using a JSON feed. You will need to add a link to the JSON feed within the <head> section of your page, and a script inside the <body> of the page to process that information. You can find the link to your JSON feed by clicking on the “Export Data” link on the view you want to export. If your application is private, you may need to “Enable Private Hyperlinks” to give you a publicly-accessible link to your JSON feed.

You are now ready to update your “blank” Web page to include the codes necessary to process your JSON feed and deliver the appropriate content to your page (the items in RED will need to be customized to your needs):

<html>

<head>

//Optional: Your default page title, which can be changed based on the Texty you include

<title> Your Site Title </title>

//Load your JSON feed from your Zoho Creator application:

<script type=”text/javascript” src=”http://creator.zoho.com/ {Username} /json/ {View number} / {Private Link – Optional} /”></script>

<script type=”text/javascript” src=”/Documents/AjaxIncludes.txt”></script>

</head>

<body>

<script>

ajaxincludes(“banner.htm”);

ajaxincludes(“navigation.htm”);

</script>

<!–Identify and Insert the appropriate Texty from your list here–>

<script>

//Identify the parameters passed through the URL:

// Example – http://lockworldherald.com/Documents/articles.aspx?Home

var winloc=”"+top.window.location;

var winsplit=winloc.split(“?”);

//If a value is found, match it to the appropriate Texty script from your Zoho Creator database

if (winsplit.length>1) {

for (var i=0; i<zoho{Username}view{View Number}.{Form Name}.length; i++){

var NewArray=zoho{Username}view{View Number}.{Form Name}[i];

var val=NewArray.Value;

var Texty=NewArray.TextyCode;

//It is a good idea to convert everything to lowercase, since javascript is case-sensitive. This way, if your page value is “superman,” your user could enter “Superman,” “SUPERMAN,” or “superman” and still get the the correct page:

val = val.toLowerCase();

var winval = winsplit[1].toLowerCase();

if (val==winval){

document.writeln(Texty);

}

//If you choose to change the Page Title for your records, include this code:

if (NewArray.Page_title>”") {

document.title=NewArray.Page_title;

}

}

}

//It is a good idea to add something here in case someone fails to enter a parameter into the page. Either redirect them to a page which will always exist, or else put the script for a fixed Texty here.

else {

location.replace(“http://yoursite.com/Documents/Testy.aspx?Value“);

// OR

document.writeln(‘<scr ‘+’ ipt type=”text/javascript” language=”javascript” src=”http://texty.com/cms/syndicate/ {Your Unique URL} .js”></scr ‘+’ ipt>’);

//NOTE: If you want to include the Texty within this code, you have to make sure you split up the <script> and </script> tags as I have done in the example above. Otherwise, your browser may get confused between a document.writeln(“</script>”); and a regular </script>, which can cause your javascript code to cease functioning.

}

</script>

<!–End Texty Script–>

<script>

ajaxincludes(“footer.htm”);

</script>

</body>

</html>

Suppose you saved this page as http://yoursite.com/Documents/texty.htm. Depending on how you’ve written the code above, your user will either be redirected to a new URL, or will see your “default” Texty that you’ve configured. However, if your user enters an appropriate parameter here (http://yoursite.com/Documents/texty.htm?About), they will see the Texty that corresponds to the parameter they have entered.

You can certainly do something like this without Zoho Creator, but you will have to hard-code all of the variables into your page header. It is much easier to add or change elements from within Zoho Creator, which is why I recommend using this service.

If you will be using more advanced content, you can even use a double-parameter, such as a content type and a parameter value. The content type can be used to determine which Zoho Creator JSON feed should be loaded. This is useful if you have a lot of different pages…Zoho only includes a maximum of 100 records in a JSON feed (I think). Also, this can help your load time…instead of loading variables for all of your content types in the header. If your pages are split into categories (for example: pages, products, articles, and resources), you can add a field to your Zoho Creator application to collect this value. Then, you can create separate views for each of the content types (set criteria on your Zoho Creator view to only display a particular content type). You can parse out the window location much the same way as above within the <head> section of your Web site to determine exactly which Zoho Creator JSON feed to load based on that parameter. To your user, the only change is how they get to the page…instead of http://yoursite.com/Documents/texty.htm?Contact, the URL would look more like this: http://yoursite.com/Documents/Texty.htm?page=Contact.

Don’t forget to manually type in the appropriate URL in your Texty account to ensure that anyone who comes across your content from a Web search will be redirected to your site. You can configure this “indexing” link for each of your Texty elements by clicking in the “Advanced Secret Options” section at the bottom of your Texty editor and entering the URL you want this content indexed to in the “URL to Texty for Search index” field. You will have to manually ensure that the URL you enter here matches your Zoho Creator database, of course.

Applications:

  • If you write a lot of articles on your Web site, this can be an easy way to add or edit articles without having to mess with the codes on your Web page very often.
  • If you don’t like HTML coding, you can build a single page and serve your entire site without ever editing the HTML again.
  • You can also use your Zoho Creator application to build a site map or navigation structure for your site, which I’ll discuss in my next post.

That’s all for today. I think Texty has a lot of potential, and I look forward to using it on my site to manage my content without sacrificing my Search Engine Optimization! In my next post, I’ll show you how to use the same Zoho Creator application you created to manage your Texty scripts into an automated sitemap-builder so you can create a navigation menu to allow people to find the content on your site.

Brought to you by Lockworld Herald.

Posted in Content Management, Level: Advanced | No Comments »

Content Management Simplified: Texty

Sunday, October 14th, 2007

Texty: Simple Content Management and SyndicationI’ve recently discovered a new Simple Content Management System (SCMS) from Texty. The idea is very simplistic, and very powerful. You can create your content from within your Texty account using a WYSIWYG (“What You See Is What You Get”) editor (rich-text editor). If you prefer, you can even edit the raw HTML for your Texty, although any javascript codes you include in the HTML will be stripped out when you save it. When you are finished editing, you will be given a small HTML script code to embed in your Web site where you want the content to appear. That’s it. Just drop the code on your site and every time that you update the content from your Texty account, the changes will automatically be reflected on your Web page.

This is very much the same idea that I’ve been using for both the AjaxIncludes and JSON forms of content management. Essentially, the only difference between Texty and these other systems is that texty provides you with a WYSIWYG editor for your content (a benefit), but you can’t include additional javascript codes directly in your Texty (a drawback).

But there’s one very important feature of Texty that makes this a far superior model for content management on your site. Texty allows you to specify an “indexing” URL so that the Google search robots will index the content of your texty as if it belonged on the page you enter! This solves the primary problems of both of the content management systems I’ve reviewed before (AjaxIncludes and JSON feeds)! Now, you can include dynamic content on your site without sacrificing your Search Engine Optimization (SEO)!

I did a test-run of this, and it turns out that the text of my page was indexed by Google, but was indexed with the URL of the actual content on the Texty site. However, Texty put a small code into the page on their site that redirected the browser to my own page. This is quite in line with the Texty approach to simplicity, and it does work.

However, Texty’s approach to making your content indexable has one minor drawback…if users are searching specifically within your site, they will not be able to find the content.

Here’s what I did…first, I created a Texty that contained a made-up word: “Simplificationactionism.” I then embedded this simply Texty content into my own Web site (http://lockworldherald.com/Documents/Texty.aspx?test=simplificationactionism). Then, I waited a few weeks to see if Google would pick up my page.

To be honest, I never did find my secret search term show up in Google on my site or on Texty’s site, although the term was picked up (temporarily) from my del.icio.us account. However, I did find a term from a different Texty (http://lockworldherald.com/Documents/Texty.aspx?test=default). When I did a Web search for “Lockworld Herald,” this term showed up in the search results within one of my Texty’s (http://www.texty.com/texty/8c10f4c2-1dfc-41f7-95ef-41ad4e8afa87.html), so I got an idea of how it would work. I think many of the problems were my fault…as I was playing around with this Texty functionality, I changed the indexing URL a few times, so I think Google initially was able to index the page, but has since dropped it because the original URL was no longer working. It may take a little time before Google picks it up again.

Texty’s SEO functionality:

I was hoping that the search results for “simplificationactionism” (or any of my search terms) would show my own page (in my LockworldHerald.com domain). I found out, however, that Google indexed the content under Texty’s Web site:

www.texty.com/texty/89afae0d-e07c-4ccc-b408-1b71e8feb619.html

This is how Google would normally index a page, and at first I thought Texty had lied about being able to index my content. However, I later realized that, since they can’t control how Google (or other search engines) index pages, they did the next best thing.

Users who click on the link provided by the search engines are redirected to my own Web site (http://LockworldHerald.com/Documents/Texty.aspx?test=simplificationactionism). Try it yourself…click on the Texty link above (texty.com/…) and you will be redirected to my Lockworld Herald Web site.

This is, perhaps, not the ideal solution, but it is certainly better than nothing. The real problem is that if someone is searching my site specifically, they will be unable to find the information they are looking for. However, the good news is that the information is being indexed and made available to search engines, so people can find what you write.

Summary:

The amazing benefits of Texty, in my opinion, more than make up for this drawback, especially since Texty brings users right back to your site when they click on a link in the search results. In fact, Texty’s only drawback is not, in fact, Texty’s problem or fault. It stems from a fundamental flaw in the way that search engines search and index the Web, which I will be discussing in this blog in a few weeks (at least, that’s the plan as of right now).

That’s all for today. In my next post, I will discuss ways to take advantage of the three content management systems I’ve discussed (AjaxIncludes, JSON feeds from Zoho Creator, and Texty) to build a truly dynamic and powerful Web site that is (relatively) simple to create, update, and manage, especially if you don’t want to spend all of your time writing HTML codes every time you want to add or update a Web page. This is particularly useful if you have a team working on your Web site…the Web developers on one side, and the content managers on the other. One of the best features of Texty, although I have not heard of anyone using it this way, is the ability to share your content on other Web sites. I will be discussing this idea in more depth shortly (either in the next post, or one after that). I will demonstrate a way to publish articles on your site and provide your visitors with the codes they need to publish the exact same content from your Texty on their own site (basically, you just share the code Texty supplies with your readers). This can be great for press releases, product information, or articles that you want to share with the world.

Brought to you by Lockworld Herald.

Posted in Content Management | No Comments »

Content Management using JSON: Pros and Cons

Monday, October 8th, 2007

As I explained in my last post, JSON offers almost endless possibilities for dynamically manipulating and displaying content from you Zoho Creator databases into your own Web site. By turning your entire database into a single javascript variable using a series of nested arrays, JSON allows you to select and display records based on date/time values, user credentials, user cookies, URL parameters, form controls, and your custom CSS styles to match the data precisely to your Web’s format and style.

However, there are a few drawbacks to using JSON feeds to provide your site content, so I wanted to use this post to weight some of the pros and cons of using JSON feeds to deliver custom content to your site.

Pros:

I outlined many of the benefits of using JSON feeds to deliver dynamic content to your site in my last post on The Web for You as well as my September 10 post on Land of ZC. Let me summarize the benefits of JSON below:

  • Match the style of your content to your site:
    Using JSON feeds along with document.write commands, you can make use of your customized Web site styles to display the information from each record in your database. For example, you can make use of simple <h1> <p> <div> <span> and other common tags to specify how the data should be displayed. Furthermore, you can programmatically change the display depending on the content. For example, you might want to display specific values (such as “free” in a catalog) in bold or using a specific color.

  • Select which records or fields within a record to display based on content:
    Since you can analyze the data before choosing whether or not to display it, you can choose to display or hide certain information based on certain parameters (such as date/time fields, visitor information, or parameters within the URL).

  • Perform operations on data:
    Because JSON is a javascript function, you can manipulate data before displaying it. For example, you can perform mathematical operations on numerical fields, split or combine text-based fields, or compare or manipulate date/time fields.

  • Display variable data using the same page template:
    One of the most powerful uses of JSON feeds to display data is the ability to build a single Web page that can display variable content based on parameters passed to it (most likely through the URL). An example of how this works can be found on my Recommended Resource list. In this sample application, I am loading data from a Zoho Creator database containing information about a variety of resources on the Web. The main page displays a list of all of the resources in the database using the custom styles of my Web site. When you click on the link for a specific resource, you are taken to a new page which displays the complete details for that resource from the same Zoho Creator database. However, rather than creating a new Web page on my site for every resource, I simply pass the specific resource ID (from the database) to a single page via the URL (http://lockworldherald.com/documents/ResourceDetails.aspx?resource=1 and http://lockworldherald.com/documents/ResourceDetails.aspx?resource=15 both use the same Web page, but display different information).

Cons:

  • Search Engine Optimization (SEO) problems with your content:
    The biggest drawback to using JSON feeds to dynamically display the data on your page is that the information displayed is completely invisible to most search engine indexing. The robots and spiders which scan your site automatically for the search engines can not see the data because it is written to your page after the page has loaded.
    This applies specifically to Web pages using Microsoft Office Live Basics, or other HTML-only Web hosting solutions. If your server allows you to write your pages using codes which can be run on the server before the page loads, the search engines will be able to “see” and process the information on your page.

  • Zoho Creator record limits:
    For most of the data views you create using Zoho Creator, the maximum number of records you can display is 100. I assume this holds true for JSON feeds as well, although I have not had the chance to test it yet. If your database has more than 100 records, you may not have access to all of the information in your database.

  • Javascript run times:
    If you have a lot of records or a very complicated script for displaying those records, you might significantly increase the load-time for your page. Likewise, the more text contained within each record, the longer it will take to load the page. For relatively small databases (small fields with a limited number of records), JSON will work quite well. But for every record you add, or more complicated fields, your page may start to load slowly, making it less desirable to your viewers.

  • Incompatible with pages designed with Microsoft Office Live Basics page-design tools:
    As with the AjaxIncludes content management solution I discussed previously, the javascript required to use this feature will not work on a page designed with the Microsoft Office Live Basics (MOLB) page designer. This has to do with the design of MOLB, which loads any HTML you add to your page after the page has loaded. What happens is that your call for the javascript variable (http://creator.zoho.com/{Username}/json/{view number}/) is not completed by the time your javascript is trying to process the variable. (I’ve been trying to figure this out for a long time, but I finally discovered why MOLB can’t handle calls for scripts on a thread in the MSDN Office Live Developer Forum – look way down the page for a post from Chris Beiter on August 24).

Summary:

While JSON can be used to give your site a high-tech look and feel with limited programming knowledge, it has one major drawback in that the content you display is essentially invisible to search engines (the primary source of traffic for most sites) – unless you are using JSON with server-side scripting. I would not recommend using JSON to deliver the primary content to your site for this reason. However, if your site’s functionality is more important than Search Engine Optimization (SEO) (like my site, LockworldHerald.com) or if the application you are working on is only a small portion of your site, JSON is a powerful tool for delivering dynamic, customizable data to your visitors.

That’s all for today. In my next post, I’ll introduce a third type of content-management for your site that utilizes both the AjaxIncludes scripts, the JSON feeds, and a new system that promises to provide an easy-to-use content delivery mechanism without damaging your SEO. That’s a pretty significant promise, and we’ll see how well it works next week.

Brought to you by Lockworld Herald.

Posted in Content Management | No Comments »

« Older Entries
Newer Entries »