Content material filters in Feather CMS

The anatomy of a content material filter

While you create a weblog submit or a static web page in Feather you should utilize the markdown filter to render the ultimate illustration of the saved content material. Additionally it is potential to spotlight Swift code snippets although one other filter. These content material filters are altering the underlying information in dynamic manner at runtime, Feather solely saves the unique information within the persistent srorage utilizing Fluent. 💪

This strategy permits us to remodel numerous textual content values utilizing manually chosen filters for every particular person frontend associated content material. For instance you’ll be able to allow the markdown filter for submit A, however if you happen to want to make use of HTML for submit B you’ll be able to disable the markdown filter and write your article utilizing the nice previous HyperText Markup Language.

Content material filters can be utilized to create your individual shortcodes. In WordPress shortcode is a small piece of code, indicated by brackets, that may carry out a devoted perform. Through the use of Feather you do not have to place shortcodes into brackets, however you’ll be able to change something you need primarily based by yourself guidelines. Curse phrases? No drawback. Print one thing utilizing Swift? Why not.

The one factor that it’s important to bear in mind that content material filters are working in a synchronous manner. Be as quick as potential, since they are going to block the execution thread. In many of the circumstances this isn’t a giant deal, however I simply wished to let that you simply will not have the ability to return a future this time. 🚀

The way to create a content material filter for Feather?

Content material filters are supplied by modules, because of this it’s important to write a Feather CMS module first. Don’t be concerned an excessive amount of, a module could be fairly easy, in our case it is simply going to be one Swift file. We’re going to write a filter that is going to exchange the fuck phrase with a duck emoji. 🦆

import Vapor
import Fluent
import ViperKit

remaining class DuckFilterModule: ViperModule {

    static var identify: String = "duck-filter"

    func invokeSync(identify: String, req: Request, params: [String: Any]) -> Any? {
        swap identify {
        case "content-filter":
            return [DuckFilter()]
        default:
            return nil
        }
    }
}

Simply place the code from above into a brand new file known as DuckFilterModule.swift contained in the Modules listing. Now we have to present the module a reputation, that is going to be duck-filter after all, and we now have to implement the invokeSync hook perform that ought to return a filter kind for the content-filter key. You may even return a number of filters per module if wanted.

Hook capabilities are fairly important in Feather CMS, modules can work collectively by dynamic hooks with out forming a dependency. This strategy could be very versatile and highly effective, you’ll be able to construct and invoke your individual hooks by the ViperKit framework. If you wish to study extra about this modular structure, you too can seize a duplicate of my Sensible Server Facet Swift guide, it is written for Vapor 4 and you may discover ways to write a modular weblog engine utilizing Swift (similiar to Feather).

Anyway, again to the subject, we simply must implement the DuckFilter object:

import Vapor
import ViperKit

struct DuckFilter: ContentFilter {
    var key: String { "duck-filter" }
    var label: String { "Duck" }

    func filter(_ enter: String) -> String {
        enter.replacingOccurrences(of: "fuck", with: "🦆")
    }
}

Mainly that is it. You simply have to change the configure.swift and append a DuckFilterModule() occasion to the module checklist. Now if you happen to run Feather with this module you’ll be able to allow the Duck filter in your contents below the content material editor admin interface. Oh by the way in which it can save you this filter below a ContentFilters/DuckFilter.swift listing subsequent to your module file.

The way to invoke obtainable filters?

Let’s check out our newly created filter. Go to the admin and create a brand new static web page with the “I do not give a fuck” content material, nicely… it may be something that comprises the f phrase, simply be artistic. 🤔

Save the web page and preview it utilizing the attention icon. It’s best to see your authentic textual content. Now if you happen to click on on the feather icon you’ll be able to choose which filters must be enabled for this specific content material. Examine the Duck, save the content material particulars and reload the preview web page. It’s best to see the duckling. 🐥

These content material filters are programmatically obtainable for you. By calling the filter technique on any FrontendContentModel kind you’ll be able to invoke the enabled filters on that content material, this may permit you to remodel an related mannequin worth utilizing filters.

let filteredValue = frontendContentModel.filter(myModel.contentToBeFiltered, req: req)

The one catch is that your Fluent mannequin must have an related content material kind since filters are tied to FrontendContentModel objects. In my earlier article I discussed find out how to create a content material relation, however possibly subsequent time I am going to create an extended submit in regards to the existence of this particular object in Feather CMS. When you have points, feedbacks or concepts, please use GitHub or Twitter.