irislines web design
irislines web design

IE8, JCE, and email links….

Yesterday at a training session a user showed me a very strange display of what should have been a linked email address.  There was all kinds of code where the link text — the email address — should have been.

She was working in Firefox on a Mac, and deleted the link and rebuilt it and all was fine. (She was editing a page that someone else had worked on….  probably in IE!)

Today I get a call from a different client who wanted to be reminded of how to link to an email address.   I walked her through it and there was the gibberish again!

Hmm….  what browser are you using?    Internet Explorer.    Aha!

So…  off I go to do more testing* and sure enough, the JCE editor creates messed up links.   In the editor you’ll see:

mailto:barb@irislines.com?subject=test
where you should be seeing the link text.

If you publish that article,  the public will see:
?subject=test'; document.write( '

If you MUST use IE,   then in adding an email link where the link text is the email address,  the JCE editor will fill the url bar of the Advanced Link Editor  with  mailto:email@domain.com.   Just click insert and the link will be fine.   DO NOT click the envelope to add email address,  bcc, cc, or Subject fields.

If the link text is NOT an email address, then the JCE editor Advanced Link Editor functions can be used.

Best Practice?   Don’t use IE!

 

* I tested in IE8  on sites that use JCE 1.5.7 and JCE 1.5.7.4.

Working on an iPad…

I’m writing this post on an iPad – trying to get used to some of the features – and to test whether I really need to buy the adminPad extension from the folks at JoomlaPraise.

One thing I noticed right away was the apparent lack of a scroll bar in the editor window. Turns out this is just how safari works on the iPad. One finger drag scrolls the whole page, two finger drag scrolls in the editor window — or other scrollable areas on a site.

When I first discovered that boxes that should scroll just seemed cut off with no way to access the remaining text, I was checking out the newly launched site for Froggy Bottom Guitars. In an Ignite Gallery display, one of the players had submitted a rather long story to go with his photo. On a computer a scroll bar is obvious – but on the iPad, it was not.

I found someone else’s blog entry about the scrolling issue, so I guess I’m not the only one who doesn’t read the manuals when a new toy arrives…. So,  a bug or a feature?  

But back to Joomla! Administration.

Here in the MyBlog editor, I’m offered plain text or rich text. I can’t do anything in the rich text window. When I access the article using the regular article manager, I can’t do anything in the JCE editor window, but can enter text if I click “hide”.  Then I’m in “code view” and to enter a tag requires switching keyboard layouts from ABC to # to symbols and back for each < or >.  Not going to happen!

Another thing to figure out is how to get an insertion point within a word, or how to move the cursor. Right now I’m double clicking to select a word and then retyping the whole word to fix a typo. That’s not too bad, but when the “word” is a URL – well, you know how long they can be…

So…. I started this blog entry on the iPad, but saved it as unpublished.   I opened it up at the computer to enter paragraph breaks, links, etc.  

I guess I will be investing in the adminPad after all!  Because other than editing Joomla! sites, I’m Loving the iPad!

Imagesized revised…

NEW version of Imagesized plugin includes more options, but forces a bg and border for all generated thumbnails.   Set to white this could often just disappear on the page, but on the fbg site I needed thumbs to sometimes be on a background image for front page.

I was using very standard image sizes so I could predict that all thumbnails would be the actual size, and not need a “fudge-factor”  so I modified the plugin code as follows:

In plg_imagesized.php  line 373

WAS

imagerectangle($result, 0, 0, $widthm-1, $heightm-1, $this->set_img_color($result,$fp_bocolor));

I changed it to

imagerectangle($result, 0, 0, $widthm, $heightm, $this->set_img_color($result,$fp_bocolor));

and line 375

WAS

$sample = imagecopyresampled($result, $image, -($width/2) + ($widthm/2)+2, -($height/2) + ($heightm/2)+2, 0, 0, $width-4, $height-4, $width_orig, $height_orig);

I changed it to:

$sample = imagecopyresampled($result, $image, -($width/2) + ($widthm/2), -($height/2) + ($heightm/2), 0, 0, $width, $height, $width_orig, $height_orig);

 

By the way, the new Imagesized plugin now offers different settings for leading or intro blog entries and the settings can be applied to front page, and/or section and category blogs.  You can exclude sections or categories from using the plugin.

It also includes a character count cut off for leading and intro articles which appends […] after the specified character.  This lets you have very even blocks for a multiple column display.   You can specify a different  ….   symbol.

Modifying Read More links

A question was posted in the Joomla! New England  forum about getting rid of the titles from the read more links generated by the Beez template overrides.  Here is how I responded:

 

The Beez template was designed for accessibility.

It is an accessibility No-No  to have multiple links on the same page with the same text that point to different urls — so…
the Beez template overrides  pull in the article title, creating unique links to the various articles. Continue Reading

jce configuration use template.css? yes

JCE editor styles – and re-visit editor background color problem…

This topic came up at Joomla! Day New England — how to get template styles to show up in jce styles dropdown and to affect the content in the editor window.

For some time now I have been installing the JCE editor for my clients to use on their Joomla sites.   And each time I have to make a decision about how to configure the editor, because this can be done in different ways and “It Depends…”  is always the right answer.

Here are a few possible issues:

1.  If the site has a colored background or image for the body tag, then the editor will also display that background — and it’s hard to edit black text on a dark background!

2.  Some templates include css something like this:

body { text-align:center ; /* for ie */ } div#wrapper { text-align:left; /* reset text alignment */ width:748px; /* or a percentage, or whatever */ margin:0 auto; /* for the rest */ }

This was for early versions of IE and we no longer need to use text-align:center; in order to center the page in the browser window, but… if you have these styles, then everything is going to appear centered in the editor window if you use template.css styles.

3.  If I want the client to be able to choose and apply special styles to the content, I need to think about what’s enough and what’s too much.

Back in May of 2009 I posted about a solution for the background color issue — it was coming up with WYSIWYG-Pro.

That solution involved modifying the template’s html to include a class on the body tag. And then, in template.css, set

body {background-color:white;} —  this will be in play in the editor window

body.body {background-color:dark;} — this will be what displays as the background when site is viewed in a browser.

This works  if you configure JCE to use the template.css styles.

jce configuration use template.css?  yes

But..   This will also display all classes used in your template.css   including things like .moduletable  and .menu.  On a large site with many custom styles, this could be overwhelming, when all your client needs is the ability to use  a few styles for controlling floated images, or a style for .quote,  .quotee,  or .alert.

jce editor with long styles dropdown

 

In this case, I would opt to NOT use the template.css file, and to create a special  editor_content.css file, including only the classes and styles that I need the client to have access to.

jce configuration use template.css?  no

jce editor with short styles dropdown.

 

If I choose to create a separate editor_content.css file, there is no need to add the class to the body tag, as I can create a rule setting a white or light body background (and aligning text) that will apply in the editor window.

Redirects using .htaccess

Set up additional domains as “parked” domains.  Then,  open the .htaccess file for the primary domain and add these lines immediately after the   RewriteEngine On  line.

RewriteCond %{HTTP_HOST} ^(www.)?BADDOMAIN.com [NC]
RewriteRule ^(.*)$ http://GOODDOMAIN.com/$1 [R=301,L]

Change the BADDOMAIN AND GOODDOMAIN as appropriate.

 

Greenhouse Website

At the CMS Expo I shared a site I had developed for the University of Massachusetts:  New England Greenhouse Up-dates  http://negreenhouseupdate.info.  I’ve gotten several emails from Expo attendees asking about the extensions used, so here’s that info.

Note:  I had to edit this blog entry in order to save it —  all references to up-dates would normallly not have the hyphen, but my host has great security and will not allow certain database terms to be used in an article or blog.   I will need to ask them to make an exception for this site and will edit the blog post once that is done.

The site features a blog of “up-dates” about all the things that can go wrong in greenhouses – and best practices to avoid them.  Some articles are just text, while a photo library provides a visual database organized in categories.  When we began the conversion to Joomla! we considered various photo gallery extensions, but ended up using regular Jooma! articles and two separate category blog displays.

For the greenhouse site we were most interested in a single search mechanism that would return “up-dates”  (text articles)  with “photos” (images with captions – sometimes article length) — we also wanted the client to be able to use the same interface for maintaining or adding new content of either type.

The extensions used to make this work were:   imagesized   to create the thumbnails from the normal article images  and

custom properties  for the tagging and search functionality that allowed searching by keyword, type of article and/or topic.

There was a template override with variables so that up-date article “readmores” would say “read more”  but the image library blog readmore links would be just the title.

I wrote that up in this blog post.

 

 

 

 

 

Yemuzip for packaging custom templates

Yemuzip was recommended at CMSExpo for zipping Joomla templates, modules, extensions, etc.  because it doesn’t include some Mac junk that the Finder’s Compress command does.  I haven’t had trouble with normal Mac zip files as long as I didn’t have any files with **s or other special characters in the file or folder names.

I downloaded this and tried it.  It’s very easy to use and offers PC or Mac compatibility.

http://yellowmug.com/yemuzip/

Ignite Gallery 2.5 – category descriptions stripped of all html tags

Fix posted by Matt on ignite’s support forum:

Edit components/com_igallery/views/igcategory/view.html.php change line 189:

Code:  
$document->setDescription( substr( JFilterOutput::cleanText($category->gallery_description), 0, 200 )  );

so it is now these 2 lines:

Code: 
$description = $category->gallery_description;
$document->setDescription( substr( JFilterOutput::cleanText($description), 0, 200 )  );

IrisLines LLC
101 Washington Street
Brattleboro, VT 05301

802 257 7391

info@irislines.com