Kategorie

Widget Plugin

1 Introduction

This document is a guide for developers to the Widget Plugin of GrandNode.
Widget Plugins are meant for displaying custom HTML, CSS, JavaScript, Razor code inside chosen widget zone.

2 The Practical Part

Widget Plugins inherit, not surprisingly, from BasePlugin, and from IWidgetPlugin

step1

IWidgetPlugin adds 3 Method declarations, but only 2 last of them are unique for Widgets 

step2

GetDisplayWidgetRoute() makes it possible to call Action which will return our PartialView

step3

In this case, Action returns raw string that contains JavaScript code

step4

GetWidgetZones() is important method that returns List<string> with names of all locations where Plugin’s View should be displayed (usually only one zone).
Below is example existing in GoogleAnalyticsPlugin 

step5

3 The Theoretical Part

For example, we want to display some Widget in main shop page.

Let’s start from Index.cshtml.

step6

The Index.cshtml calls HtmlExtensions.Widget() (Html Helper Action), the value of widgetZone parameter is “home_page_top”

step7

HtmlExtensions.Widget()  calls WidgetController.WidgetsByZone(). The argument remains the same.

step8

This Action, however, returns not directly a PartialView, but the List<RenderWidgetModel> that makes it possibly to identify what PartialView actually to return.

Finally, our Plugin’s Action PublicInfo is called, and we can return anything we request for.
In this example, we return JavaScript code as raw string.
But it is of course possible to return View() with ViewModel. 

step9

Assuming you’re mainly interested in admin widgets, you can add your content in these widget zones

step10

back to top