Insert A Twitter Feed Add-in

Screenshot Insert menu Add a Twitterfeed.

Add a Twitterfeed

Do you want to display your own or someone else’s Twitter Feed on your site? The latest add-in from Ian Haynes, a MS MVP for Expression Web, will let you do just that. Download and install the add-in either from the Expression Gallery. Need help in Installing Expression Add-ins.

Once you have installed the add-in,  a new menu item will appear on the Insert menu.

Screenshot Insert A Twitter Feed dialog box.

Insert A Twitter Feed dialog box

To insert a Twitter Feed into your page:

  • Open your page and place your cursor where you want the Twitter Feed to appear.
  • From the Insert menu, select Twitter Feed.
  • Type the Feed name.
  • Type the Feed width on page. This can be in pixels, ems’s or percentages.
  • Select if you want Tweet time to show.  Tweet name?  Tweet icon? The default for each of these is Yes.
  • Select the number of Tweets you want to show. The default is 12.
  • Select the Preview button and you will see the Preview of your Tweets.
  • Click Add to Page and the necessary code in added to your page. Save the Page and the embedded files.
  • You can then Preview your page in your favorite browser and see your Twitter Feed where you requested it be placed. No complicated code to write and your page should validate if the rest of the code is valid.
  • Publish your page and your Tweets will now be part of that page.
Twitter Feed on web page.

Twitter Feed on Web Page.

Thank you Ian. Great new tool and easy to use.  Download Insert A Twitter Feed Add-in.

Visit Ian’s site Expression Web Resource.

Expression Web Forum

Expression Web Forum screenshot.

Expression Web Forum

A great new resource to ask questions, read helpful tips, and find resources for Expression Web (all versions) is the new Expression Web Forum started by MS MVP Cheryl Wise. It is very user friendly.

Under the Section for Expression Web, you will find Categories for:

  • Newbie - Are you new to Expression Web or standards based web design? Are you migrating from a WYSIWYG web editor? If so, this is where you get started.
  • Expression Web – General questions on using Expression Web.
  • FAQs – Frequently Asked Questions about Expression Web & Web Design.
  • Add-Ins & Extensions – Interested in extending Expression Web? Ask for, recommend/review or discuss Expression Web add-ins.
  • FrontPage to Expression Web – If you have a FrontPage website and are looking to migrate to a modern web editor, this section is for you.

Under the General Web Design section, you will find categories for:

  • Dreamweaver - Many of the folks here use more than one web editor. Dreamweaver is used by many of the professionals who belong to this group so while this isn’t a Dreamweaver forum you can frequently find help and advice on Dreamweaver in this section.
  • Other Web Editors – Maintaing or migrating a site that was created in some other web editor whether it was a hosted site builder or entry level editor like Coffee Cup’s HTML editor or something that outputs HTML but shouldn’t like Publisher this is your place.

The section for Practical CSS contains the following:

  • Beginning CSS – There is no CSS question too basic to ask here.
  • Templates - CSS based templates for Expression Web.
  • Display Issues – If your page is not displaying the way you expect, post a link to the PUBLISHED site (even if the location is only temporary) and post it here with and explain how it should look when you need help.
  • Experimental & Advanced – Trying some CSS 3 or other more advanced techniques, this is the spot.

Coding & Web Development contains:

  • ASP.NET – ASP.NET discussions.
  • JavaScript & jQuery – script questions can be asked here.
  • PHP - PHP discussions take place here.

And last but certainly not least, is the Coffee House for Off-topic discussions and Introductions. So if you are looking for help with any version of Expression Web or moving from FrontPage to Expression Web, the Expression Web Forum is the place for you. Come on over and register, introduce yourself, and check out what is available.

Expression Web 4 Add-ins from Ajatix

Ajatix has updated three of their add-ins so they now work with Expression Web 4.0. The include:

These are commercial add-ins. I have personally used all of them and you can read more about them from Expression Web Add-ins.

You can see a sample of the CSS Menu on my free Ocean Template.

Review and Examples of  Lightbox for Expression Web

Review and Example of Ajatix Expression Web CSS Menu Add-ins

All three Ajatix Add-ins for Expression Web are ON SALE thru August 20th.

Structural Naming Convention in CSS

Found this interesting and informative post on the Six Revisions blog which is part of his CSS Tips series.

Structural naming convention means that you name elements by describing what they are, rather than where they are or how the look. You do this by assigning a class (dot) or id (# hash mark) to the element.  Presentational naming describes the location and/or appearance of web page elements.

The post discusses the concept of structural naming conventions, the benefits of using this convention, and shares some guidelines on practical applications of structural naming conventions.

First he gives an example (1) of a presentational naming layout and then discusses what is wrong with this approach. The presentational naming layout inlcudes:

  • #top-div
  • #left-col
  • #right-col
  • #bottom-div

The next example (2) uses a structural naming convention and includes the following:

  • #header
  • #main-content
  • #secondary-content
  • #footer

Example 3 really uses structural naming conventions which includes:

  • #branding
  • #main-content
  • #secondary-content
  • #site-info

The last example,using  fully-structural in naming conventions,  describes what the div’s and other elements are for, instead of where they are or how they look.

The second part of the post offers a few guidelines which include:

  1. When assigning a class or id, ask yourself “What is this element for?”
  2. Avoid using names that rely on locational or visual aspects of the particular element.
  3. Use names that are intuitive to you.

He also includes some Further reading resources on this same topic:

You can read  CSS Tip #2: Structural Naming Convention in CSS in its entirety.

Five Things Not to Forget on a New Site!

I discovered a new blog today – Dazzlin Donna. One of her posts, Don’t Forget These Five Things on a New SIte, reminded me of a couple of things I sometimes forget. What about you, does your site contain the following?

Robots.txt file

A robots.txt file will tell the search engines to index every page or your site or not allow certain pages. If you want all pages of your site indexed, the robots.txt file should look like this:

User-Agent: *
Disallow:

If you do NOT have a robots.txt file, the default behavior is to index everything. If you want to disallow certain directories, then you need to specify them in your robots.txt file.  In that case, your file might look something like this:

User-agent: *
Disallow: /cgi-bin/
Disallow: /folder-name/
Disallow: /folder-name/

You can write your own robots.txt file or use  can generate a custom robots.txt file with a tool like http://tools.seobook.com/robots-txt/generator/

You can read more  about what a robots.txt file is all about, by visiting http://www.robotstxt.org/robotstxt.html.

XML sitemap

An XML sitemap is not required on your site but is a good way to let the search engines know about pages on your sites that are available for crawling.

Google introduced Google Sitemaps so web developers can publish lists of links from across their sites. The basic premise is that some sites have a large number of dynamic pages that are only available through the use of forms and user entries. The Sitemap files can then be used to indicate to a web crawler how such pages can be found. Google, Bing, Yahoo and Ask now jointly support the Sitemaps protocol. ~ Wikipedia ~

To read more about sitemaps, visit http://www.sitemaps.org/. If you have a WordPress blog, then download this plugin, and that job will be a little easier.

Custom 404 page

What does a visitor to your site see if they try and visit a page that no longer exists?  A generic 404 – Not Found page? Or have you provided them with a custom 404 page that allows them to continue to navigate your site? You can find a tutorial on Custom Error Pages – Customizing BlueHost Error Pages on our sister site, Expression Web Tutorials & Templates and one on How to create custom Error Pages on Genealogy Web Creations.

Do your visitors a favor and create your own Custom 404 page.

Favicon

What is a Favicon? It’s that tiny little graphic that shows when you bookmark a site like the EW on this blog. A favicon (short for favorites icon) is a 16×16 or 32×32 pixel square icon associated with a particular website or webpage.  Use any square image file and run it through a favicon generator like the one provided by Dynamic Drive. Upload the file to the root directory of your site and insert the code given below in the head section of your page.

The code to inset the favicon looks like this <link rel=”shortcut icon” type=”image/x-icon” href=”/favicon.ico>

Analytics code

And last but not lease, don’t forget to add your analytics or stats code to your new site. Whether you use Google Analytics or a different one, find the instructions and the code to use and add it to your pages.

You can read Dazzlin Donna’s full post Five Things Not to Forget on a New Site! Thanks Donna for a great reminder.