Embedding a Youtube Video on EPiServer

Embedding youtube video

Several pages in our website require embedded Youtube videos. So I created a Youtube block that accepts the following Content properties:

  • Title
  • Description
  • Embed link

While it’s Settings properties are:

  • Width
  • Height
  • Allow Full Screen
  • Auto Play

Here’s my code for the model:

 public class YoutubeBlock : BlockData  
 {  
      [Display(  
           Name = "Title",  
           GroupName = SystemTabNames.Content,  
           Order = 10)]  
      public virtual string VideoTitle { get; set; }  
      [Display(  
           Name = "Description",  
           GroupName = SystemTabNames.Content,  
           Order = 20)]  
      public virtual string Description { get; set; }  
      [Display(  
           Name = "Url to Youtube Video",  
           GroupName = SystemTabNames.Content,  
           Order = 30)]  
      [Required]  
      public virtual Url YoutubeLink { get; set; }  
      [Display(  
           Name = "Width",  
           GroupName = SystemTabNames.Settings,  
           Order = 10)]  
      public virtual int Width { get; set; }  
      [Display(  
           Name = "Height",  
           GroupName = SystemTabNames.Settings,  
           Order = 20)]  
      public virtual int Height { get; set; }  
      [Display(  
           Name = "Allow Full Screen?",  
           GroupName = SystemTabNames.Settings,  
           Order = 30)]  
      public virtual bool AllowFullScreen { get; set; }  
      [Display(  
           Name = "Auto Play?",  
           GroupName = SystemTabNames.Settings,  
           Order = 40)]  
      public virtual bool AutoPlay { get; set; }  
      public override void SetDefaultValues(ContentType contentType)  
      {  
           this.AllowFullScreen = true;  
           this.AutoPlay = false;  
           this.Width = 520;  
           this.Height = 292;  
      }  
 }  

Nothing special with my controller:

 public class YoutubeBlockController : BlockController<YoutubeBlock>  
 {  
      public override ActionResult Index(YoutubeBlock currentBlock)  
      {  
           return PartialView(currentBlock);  
      }  
 }  

And then my View:

 @model YoutubeBlock  
 <div class="youtubediv">  
   @if (String.IsNullOrEmpty(Model.VideoTitle))  
   {  
     <h3>@Html.PropertyFor(y => y.VideoTitle)</h3>  
   }  
   @if (String.IsNullOrEmpty(Model.Description))  
   {  
     <p>@Html.PropertyFor(y => y.Description)</p>  
   }  
   @{  
     var youtubeLink = Model.YoutubeLink.OriginalString;  
     if (Model.AutoPlay)  
     {  
       youtubeLink += ((youtubeLink.Contains("?")) ? "&" : "?") + "autoplay?=1";  
     }  
     var allowFullScreen = Model.AllowFullScreen ? "allowfullscreen" : "";  
   }  
   <iframe width="@Model.Width" height="@Model.Height" src="@youtubeLink" @allowFullScreen style="border: none;"></iframe>  
 </div>  

The recommended way of embedding video is to use the iframe. However, you can also use the elements Object and Embed as per W3schools.

Meanwhile on the EPiServer CMS Edit mode…

 

 

How to Create an RSS Feed in EPiServer (ASP.NET MVC)

Thanks to Ted and a guy from CodeInside for your blogs which helped come up with this solution.

Problem: Create an RSS feed for ASP.NET MVC Website with EPiServer

Solution: We need three things

1. RssResult class
2. RssPage page type
3. RssPageController which creates the xml rss feed

So let’s begin with the RssResult class. This class needs to inherit FileResult (System.Web.Mvc) passing rss+xml as content type.

 public class RssResult : FileResult  
{
private readonly SyndicationFeed _feed;
public RssResult(SyndicationFeed feed)
: base("application/rss+xml")
{
_feed = feed;
}
public RssResult(string title, List<SyndicationItem> feedItems)
: base("application/rss+xml")
{
_feed = new SyndicationFeed(title, title, HttpContext.Current.Request.Url) { Items = feedItems };
}
protected override void WriteFile(HttpResponseBase response)
{
using (XmlWriter writer = XmlWriter.Create(response.OutputStream))
{
_feed.GetRss20Formatter().WriteTo(writer);
}
}
}

Then, we create a model page type which I’ve named RssPage.cs. It basically only has one property which holds the root page of the RSS

 [ContentType(  
DisplayName = "Rss Page",
GUID = "2ba86356-847f-439f-bf1c-36f7cf70158e",
Description = "Used to create an RSS Feed")]
public class RssPage : SitePageData
{
[Display(
Name = "RSS Root Page",
GroupName = SystemTabNames.Content,
Order = 10)]
[Required]
public virtual PageReference RssPageLink { get; set; }
public PageDataCollection GetPages()
{
var pages = DataFactory.Instance.GetChildren(RssPageLink);
return FilterForVisitor.Filter(pages);
}
}

Now we create the controller for this page type.

 public class RssPageController : PageControllerBase<RssPage>  
{
public ActionResult Index(RssPage currentPage)
{
return Feed(currentPage);
}
public virtual ActionResult Feed(RssPage currentPage)
{
var items = new List<SyndicationItem>();
var newsPages = DataFactory.Instance.GetChildren<NewsPage>(currentPage.RssPageLink);
var pageUri = currentPage.RssPageLink.GetUri();
foreach(var newsPage in newsPages)
{
var feedPackageItem = new SyndicationItem(newsPage.PageTitle, newsPage.Description, pageUri);
feedPackageItem.PublishDate = newsPage.StartPublish;
items.Add(feedPackageItem);
}
return new RssResult("My News Feed", items);
}
}

Now we create an instance of this page on EPiServer.

Navigating to this page now shows an xml rss page

Any questions, please comment!

EPiServer 7.x vs EPiServer 8

I was tasked to find out whether our current active license for CMS 7 will still work with EPiServer 8. So I did some research and thought of sharing it here as well.

Summary Version:

  • Good news – Our 7.x license will continue to work for EPiServer 8.0
  • Current EPiServer version available in NuGet is 8.3.0.
  • EPiServer 8 has breaking changes but mostly needing just code recompilation
Long Version:
Here’s the forum that confirms our active subscription will continue to work for this new major version.

If the customer has an active subscription the license that has been used for 7.x will continue to work. When it comes to how certifications are handled for new major versions we will soon give you an update on that. But, rest assured, your EPiServer 7 certification will continue to be valid.

EPiServer has started a continuous release process since about a year ago. Checking their last releases, here’s what is recent…

Updating to CMS 8 is no different from updating to the feature updates delivered via NuGet. They have however, named it to a major version and this is because it has some breaking changes. List of breaking changes here: http://world.episerver.com/documentation/Items/Upgrading/EPiServer-CMS/8/Breaking-changes/
Some of the new features:

  • Multi-publish and preview – there’s a new concept called ‘Projects’ in the Editor
  • Performance Improvements
  • Updated browser support – IE9 is no longer supported!
  • Support for canonical URLs
  • Better ways to organize content types and properties
  • Improved control to ensure design consistency
Other links I thought are useful:

Hope this helps anyone!

Int64 / Long / Bigint Property is not supported in EPiServer 8

Yes, you read it right. You can’t have a model property of type Int64 / long.

I came across an issue where in I have a model that requires to store an Id (from the database) as one of it’s properties. It so happens that most tables we have at work go by an Id of type Bigint (SQL Server).

So I had to create something like:

 public class MyModel {  
[Editable(false)]
[BackingType(typeof(PropertyNumber))]
public virtual long SomeObjectId { get; set;}
// and some other properties below...
}

However, when I run the app, I get the following error:

Type ‘System.Int64’ could not be mapped to a PropertyDefinitionType

Yes, PropertyNumber only supports Int32, etc.

So I fixed this by changing the data type to string so it stores the Int64 as string, but parse it back when I need it as Int64.

 public class MyModel {  
[Editable(false)]
[BackingType(typeof(
PropertyString))]
public virtual string SomeObjectId { get; set;}
// and some other properties below...
}

Notice that I also updated the backing type.

I’m not sure if this is the best way of playing with Int64’s, but it solved my problem!

PS. Looks like this has been the case ever since