...
You must implement the IFotowareMedia interface on a content type that inherits from the Optimizely MediaData class in your solution. This enables additional fields that the add-on uses to maintain synchronization with the original media.
| Code Block | ||
|---|---|---|
| ||
public interface IFotowareMedia : IContentData
{
string Name { get; set; }
/// <summary>
/// Fotoware alternative text
/// </summary>
string FotowareAltText { get; set; }
/// <summary>
/// Fotoware description
/// </summary>
string FotowareDescription { get; set; }
/// <summary>
/// Fotoware CDN url
/// </summary>
string FotowareUrl { get; set; }
/// <summary>
/// Fotoware Preview CDN url
/// </summary>
string FotowarePreviewUrl { get; set; }
/// <summary>
/// Fotoware JSON metadata
/// </summary>
string FotowareJson { get; set; }
/// <summary>
/// Fotoware modified date
/// </summary>
DateTime? FotowareModifiedDate { get; set; }
}
``` |
Example implementation of IFotowareMedia
| Code Block | ||
|---|---|---|
| ||
[ContentType(GUID = "0A89E464-56D4-449F-AEA8-2BF774AB8730")]
[MediaDescriptor(ExtensionString = "jpg,jpeg,jpe,ico,gif,bmp,png")]
public class ImageFile : ImageData, IFotowareMedia
{
[UIHint(UIHint.Textarea)]
public virtual string Description { get; set; }
public virtual string AltText { get; set; }
// IFotowareMedia properties
[Display(GroupName = FotowareGroupNames.Fotoware)]
public virtual string FotowareUrl { get; set; }
[Editable(false)]
[Display(GroupName = FotowareGroupNames.Fotoware)]
public virtual string FotowarePreviewUrl { get; set; }
[UIHint(UIHint.Textarea)]
[Editable(false)]
[Display(GroupName = FotowareGroupNames.Fotoware)]
public virtual string FotowareJson { get; set; }
[Editable(false)]
[Display(GroupName = FotowareGroupNames.Fotoware)]
public virtual DateTime? FotowareModifiedDate { get; set; }
[ScaffoldColumn(false)]
public string FotowareAltText
{
get => this.GetPropertyValue(p => p.AltText);
set => this.SetPropertyValue(p => p.AltText, value);
}
[ScaffoldColumn(false)]
public string FotowareDescription
{
get => this.GetPropertyValue(p => p.Description);
set => this.SetPropertyValue(p => p.Description, value);
}
}
``` |
The ModifiedDate property is used to track when the media was last changed in the DAM. The plugin uses it to determine whether to download the media.
...
Example of TinyMCE configuration
| Code Block | ||
|---|---|---|
| ||
services.Configure<TinyMceConfiguration>(config =>
{
config.Default().AddSetting("extended_valid_elements",
"iframe[src|alt|title|width|height|align|name],picture,source[srcset|media|src],span")
.AddPlugin(
"epi-link epi-image-editor epi-dnd-processor epi-personalized-content preview searchreplace autolink directionality visualblocks visualchars fullscreen image link media template codesample table charmap pagebreak nonbreaking anchor insertdatetime advlist lists " +
"wordcount help code")
.Toolbar(
"bold italic strikethrough forecolor | epi-link image media epi-image-editor epi-personalized-content | contentplatform-insert-media | bullist numlist | searchreplace fullscreen ",
"styleselect blocks | alignleft aligncenter alignright alignjustify | removeformat | table toc | code"
, "");
});
``` |
By default, the button is added to the default TinyMCE, but if you have custom tinys for blocks with other configurations, you can apply the following: .AddFotowareContentPlatformToTinyMCE(serviceCollection)
...