Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Damon 217 posts 288 karma points
    Mar 31, 2016 @ 16:51
    Damon
    0

    Help with publishing image within a rich text editor - maybe simple for someone who knows

    Hi,

    I am using Courier, the very latest 2.52.3.

    Pages publish fine. However, when there is an image added to a rich text , Courier does not seem to pick it up as a dependency and hence does not publish the image along with the page.

    Can someone please tell me what configuration I need to add to courer.config to achieve this. This must be a very common task I would have thought.

    I have tried to research the config file, but do not seem to be able to find what I am looking for,

    Thanks a lot for any help!

  • Si Burgess 15 posts 56 karma points
    Apr 25, 2016 @ 15:39
    Si Burgess
    0

    Hi Damon,

    Did you find a solution to this? I'm experiencing the issue.

    Cheers, Si

  • Dennis Aaen 4500 posts 18255 karma points admin hq c-trib
    Apr 25, 2016 @ 17:39
    Dennis Aaen
    0

    Hi Si,

    Which version of Courier are you using at the moment?

    /Dennis

  • Si Burgess 15 posts 56 karma points
    Apr 25, 2016 @ 17:43
    Si Burgess
    0

    The latest 2.52.4 in Umbraco 7.3.8.

    Doesn't look like it's even handling RTE when in a grid.

  • Dennis Aaen 4500 posts 18255 karma points admin hq c-trib
    Apr 26, 2016 @ 12:38
    Dennis Aaen
    1

    Hi Damon and Si.

    I have been talking to one from the Courier development team, and right now we do not transfer images in the rich text editor, unfortunately.

    So I would recommend you to kulild or see if someone else in this great community have created a package for something like this.

    What you need is a resolver that trigger on RTE editor and the needs to search for tags.

    For documentation have a look here. https://github.com/umbraco/Courier/blob/master/Documentation/Developer%20Documentation/Data%20Resolvers.md

    Hope this helps,

    /Dennis

  • Si Burgess 15 posts 56 karma points
    Apr 26, 2016 @ 13:23
    Si Burgess
    0

    Thanks for the reply and confirming Dennis. I read something contradictory in another forum post that images were transferred when in the RTE but glad to have the clarification. :)

    No probs, I will roll my own GridCellResolverProvider and inspect for images. Once I have it working I'll pop a copy of the class up for others who would like it.

  • Chris Ashton 57 posts 89 karma points
    Apr 30, 2016 @ 15:22
    Chris Ashton
    0

    Hi Si,

    Did you manage to get this working?

    Cheers, Chris

  • Si Burgess 15 posts 56 karma points
    May 01, 2016 @ 10:14
    Si Burgess
    0

    Hi Chris,

    Yep I got this working. I'll post the class up on Tuesday when I'm back at work.

    Cheers, Si

  • Chris Ashton 57 posts 89 karma points
    May 01, 2016 @ 11:55
    Chris Ashton
    0

    Fantastic Si, it'd be very much appreciated.

    Chris

  • Si Burgess 15 posts 56 karma points
    May 05, 2016 @ 14:39
    Si Burgess
    0

    Sorry for the delay, this is what created and works in 2.52.4 in Umbraco 7.3.8

    using HtmlAgilityPack;
    using System.Collections.Generic;
    using System.Linq;
    
    using Umbraco.Courier.Core;
    using Umbraco.Courier.Core.Common.Extensions;
    using Umbraco.Courier.Core.Logging;
    using Umbraco.Courier.DataResolvers.PropertyDataResolvers;
    using Umbraco.Courier.ItemProviders;
    
    namespace ChangeToYourNamespace
    {
        public class RteGridEditorGridCellResolverProvider : GridCellResolverProvider
        {
            public override bool ShouldRun(string view, GridValueControlModel cell)
            {
                try
                {
                    var alias = cell.Editor.Alias;
                    var shouldRun = view.Equals("rte") && alias.Equals("rte");
    
                    CourierLogHelper.Debug<RteGridEditorGridCellResolverProvider>(string.Format("ShouldRun = {0}, view: {1}, cell.Editor.Alias: {2}", shouldRun, view, alias));
                    return shouldRun;
                }
                catch
                {
                    CourierLogHelper.Warn<RteGridEditorGridCellResolverProvider>(string.Format("ShouldRun could not get alias for cell with view: {0}", view));
                    // ignored
                }
    
                return false;
            }
    
            public override void PackagingCell(Item item, ContentProperty propertyData, GridValueControlModel cell)
            {
                //CourierLogHelper.Info<RteGridEditorGridCellResolverProvider>(string.Format("PackagingCell: cell: {0}", cell));
                //CourierLogHelper.Info<RteGridEditorGridCellResolverProvider>(string.Format("PackagingCell: cell.Value: {0}", cell.Value));
    
                // Get the markup from the RTE
                var rteMarkup = cell.Value.ToString();
    
                // Search the markup for image tags.
                var htmlDoc = new HtmlDocument();
                htmlDoc.LoadHtml(string.Format("<html><head></head><body>{0}</body></html>", rteMarkup));
    
                var imageIdAndPath = new Dictionary<int, string>();
    
                // Find <img>'s with src attributes that are from the /media/ path and get their ID's.
                htmlDoc.DocumentNode.SelectNodes("//img[@src][@data-id]").ForEach(image =>
                {
                    var src = image.Attributes["src"].Value;
                    var dataId = image.Attributes["data-id"].Value;
                    int id;
    
                    if (!src.StartsWith("/media/") || string.IsNullOrWhiteSpace(dataId) || !int.TryParse(dataId, out id))
                        return;
    
                    // Only need to process the image once so don't add again.
                    if (!imageIdAndPath.ContainsKey(id))
                        imageIdAndPath.Add(id, src);
                });
    
                // Return out if no image ID's have been found.
                if (!imageIdAndPath.Any())
                    return;
    
                // Process the discovered images...
                imageIdAndPath.ForEach(imageIdPath =>
                {
                    // Add the image path to the item.Resources, this will add the file to the "Files to be deployed" list.
                    item.Resources.Add(imageIdPath.Value);
    
                    // Create the image 'Media' dependancy and add it to the item.Dependencies.
                    // Courier will add the Media Property Data entry for us.
                    var imageUniqueId = PersistenceManager.GetDefault(ExecutionContext).GetUniqueId(imageIdPath.Key, UmbracoNodeObjectTypeIds.Media);
                    var imageMediaDependency = new Dependency(imageUniqueId.ToString(), ItemProviderIds.mediaItemProviderGuid);
                    item.Dependencies.Add(imageMediaDependency);
    
                    CourierLogHelper.Info<RteGridEditorGridCellResolverProvider>(string.Format("PackagingCell: Added image with ID {0} ({1}) from path: {2}", imageIdPath.Key, imageUniqueId, imageIdPath.Value));
                });
            }
        }
    }
    
  • Richard Waite 11 posts 79 karma points
    Aug 21, 2017 @ 14:53
    Richard Waite
    0

    This is still broken in Umbraco 7.6.0.

    Si's solution still works but the 'data-id' attribute is no longer used in 7.6 so use the 'data-udi' attribute instead.

    Here's the code that worked for me, I also extended it to include linked files as well as just images:

    // Find <img>'s with src attributes that are from the /media/ path and get their ID's.
        htmlDoc.DocumentNode.SelectNodes("//img[@src][contains(@data-udi,'media')] | //a[@href][contains(@data-udi,'media')]").ForEach(node =>
        {
            var dataUdi = node.Attributes["data-udi"].Value;
            GuidUdi udi = GuidUdi.Parse(dataUdi);
    
        var guid = udi.Guid;
        var src = node.Attributes["src"] != null ? node.Attributes["src"].Value : node.Attributes["href"].Value;
    
        var ms = ApplicationContext.Current.Services.MediaService;
        var mediaItem = ms.GetById(guid);
        var itemId = mediaItem.Id.ToString();
    
        int id;
    
        if (string.IsNullOrWhiteSpace(itemId) || !int.TryParse(itemId, out id))
            return;
    
        // Only need to process the image once so don't add again.
        if (!imageIdAndPath.ContainsKey(id))
            imageIdAndPath.Add(id, src);
    });
    
Please Sign in or register to post replies

Write your reply to:

Draft