Issues with rendering in EPiServer preview-tab

September 6, 2010 | 5 comments

I have noticed that several JavaScript features added to your Page Templates malfunction in the preview-tab in edit mode. It appears that it is a larger issue in Internet Explorer and most editors uses IE (because that is the only browser with a rich text editor prior to EPiServer 6).

The root cause of this problem is related to the fact that the jQuery ready handler or the onload-event of the page you want to preview is triggered while the preview iframe is hidden.

So, executing JavaScript at this stage triggers a whole set of problems. I suspect that since the loaded page is invisible, IE does not give you the correct values for elements layout (failure in retrieving correct height and errors in size calculations).

But jQuery works well with iframes! Why not in EPiServer CMS preview-tab?

There is a css class previewframe in system.css that has "display: none" which makes the iframe hidden from start. The iframe element then gets an inline style with a height and “display: block” _after_ the page is loaded into the iframe and events are executed.

Workarounds

If you want to patch EPiServer, remove "display: none" from css class "previewframe" in system.css. You will find this file in your Program Files folder and it will affect all sites.

Another way is to delay execution of the ready handler in edit mode. It is really dirty and ugly but it solves most problems. 

<script type="text/javascript">
  <asp:Placeholder runat="server">
    $().ready(
    <%= (Request["idkeep"] != null) ? "function() { setTimeout(" : "" %>
      function(){ $('#equalize').equalHeights(); $("#ctl00_ContentContainer").equalHeights(); }
    <%= (Request["idkeep"] != null) ? ", 500 )}" : "" %>
    );
  </asp:Placeholder>
</script>

Do you have better suggestions? I’m eager to hear them!

Update: This affects sIFR, Google Maps, jQuery plugins like jCarousel, equalHeights, etc. Logged as Bug #56651: Content in preview-tab in edit mode has rendering issues.

Bookmark and Share

Tags:

EPiServer CMS with Facebook Open Graph

August 16, 2010 | No comments

I just implemented support for the Open Graph protocol on an EPiServer CMS site to improve Facebook Share and Facebook Like.

First thing noticed is that it looks that Facebook have problem with national characters like ÅÄÖ and other Unicode characters when sharing or liking a page. At least sometimes. I think they change and improve their platform because things that worked before stopped working just a few days ago.

Facebook can not handle UTF-8 with Byte Order Mark (BOM)

ASP.NET and EPiServer CMS platform uses UTF-8 to encode content and the Emit UTF-8 identifier-flag is true by default and this adds the Unicode Byte Order mark first in the output stream. This is not really needed for UTF-8 and can causes problem.

It is easy to remove the BOM by adding one line of code to your master page.


public partial class MasterPage : System.Web.UI.MasterPage
{

    protected override void OnInit(EventArgs e)
    {
        base.OnInit(e);
        Response.ContentEncoding = 

            new System.Text.UTF8Encoding(false);
    }
Bookmark and Share

Tags: , ,

How to fix alphabetic sorting of pages in EPiServer

April 15, 2010 | 3 comments

I recently got the question how to fix the incorrect alphabetic sorting of child pages in EPiServer. It is usually Scandinavian users complaining that Å, Ä and Ö are sorted together with A and O instead of being at the end of the list.

Sort order: Alphabetical

When you specify the sort order of child pages your selection is stored in the database (tblPage.PeerOrderRule) and is shared for all language branches.
When you use GetChildren() it calls a stored procedure called netPageLinkList that returns the children ordered differently depending on the selection. Sorting is done in the database.

Easy Solution To Child Page Sort Order in EPiServer

1) Easiest way to fix sorting is to change the Collation order of the Name column in the tblPageLanguage table.

image

different sort order depending on the current culture

The easy solution only allows one common sort order for the entire database and that might not be good enough for multi lingual sites.
2) You can solve this for the whole site by hooking the event DataFactory.FinishedLoadingChildren and resorting the pages. Remember that this event is called every time you call GetChildren() and the result is not cached.
3) Another way is to solve it locally is to use the FilterSort class on you PageDataCollection or setting the SortOrder property on you PageList.
Bookmark and Share

Tags: , , , , , , , ,

EPiServer CMS 6: SocketException with VPN

March 26, 2010 | No comments

If you use new EPiServer CMS 6 and have a VPN tunnel open you may get an exception when starting your EPiServer site.

SocketException (0x2747): An operation on a socket could not be performed because the system lacked sufficient buffer space or because a queue was full

This is reported in Bug #33715 that should be fixed but.

How to workaround the defect

Just comment the whole system.serviceModel section in web.config! Or remove the endpoints using soap.udp inside services or clients-tag.

To be more specific, it is the custom soap.udp protocol used by default settings for Remote Events that is not working with VPN.

Remote Events is only needed in a load balanced or enterprise multi-site scenario so there is no problem to remove it.

You can still get it Remote Events to work with VPN using tcp protocol. Read more in my blog: http://blog.fredrikhaglund.se/blog/2009/09/22/episerver-cms-how-to-configure-remote-events-with-many-servers-and-firewalls-between-them/

Bookmark and Share

TechDays: Dino Esposito’s ASP.NET 4.0 highlights

March 23, 2010 | No comments

In short, ASP.NET 4.0, gives you more control.

  • CSS friendly HTML from Server Controls by default.
  • EnableViewState does not work as you expect in ASP.NET 2.0. With the new ViewStateMode property with values: Inherit, Enable and Disable you get what you expect.
  • ClientIDMode with value Predictable generates shorter ID attributes and possible for humans and javascript developers to handle.
  • I think Auto-Encoding is going to be valuable for EPiServer Developers. The Auto encoding blocks “<%: … %>” and the IHtmlString marker interface that ensures you do not encode a string twice.
  • For SEO there are properties on Page class for MetaKeywords and MetaDescription. Also support for both 301 and 302 redirects and Routing gives Friendly URL instead of path to aspx-files.

And much more at Dinos blog…

Bookmark and Share

Tags: ,

« Older entries § Newer entries »