# Widget samples in GitHub

This section includes tutorials that introduce you to more complex scenarios when working with MVC widgets in Sitefinity CMS.

In addition, following is a list with samples. You can download any of the samples from the [GitHub repository](https://github.com/Sitefinity/feather-samples).

<table>
<tbody>
<tr>
<td>

<strong>Sample</strong>

</td>
<td>

<strong>Description</strong>

</td>
</tr>
<tr>
<td>

[DevMagazine site](https://github.com/Sitefinity/feather-samples/tree/master/DevMagazineSite)

</td>
<td>

The website showcases how you can use the MVC framework to build an entire website from scratch. The site includes:

* Mobile responsive design
* Built-in widgets
* Custom widgets with simplified dependency injection, use of content locations service for resolving items’ locations, Master/Detail view functionality, and so on
* Frontend packages for delivering responsive design and defining all styling rules

To see a detailed tutorial how to build the site, see [Create a DevMagazine site](https://www.progress.com/documentation/sitefinity-cms/tutorial-create-a-devmagazine-site-mvc).

</td>
</tr>
<tr>
<td>

[List widget](https://github.com/Sitefinity/feather-samples/tree/master/ListWidget)

</td>
<td>

Demonstrates how to create a simple MVC List widget. The List widget displays a list of items on the frontend and provides functionality for configurations via a customized designer. You learn how to create a MVC widget in a separate assembly that uses a custom designer.

To see a detailed tutorial, see [Create a List widget](https://www.progress.com/documentation/sitefinity-cms/create-a-list-widget-mvc).

</td>
</tr>
<tr>
<td>

[Custom widget with multiple selectors](https://github.com/Sitefinity/feather-samples/tree/master/AuthorWidget)

</td>
<td>

<p>Demonstrates how to create a simple MVC <em>Author</em> widget:</p>
<ul>
<li>Displays an author with his name and description</li>
<li>Displays profile image</li>
<li>Links to a page in Sitefinity and to an external page</li>
</ul>
<p>You learn how to build a complex designer leveraging the built-in client components.</p>

</td>
</tr>
<tr>
<td>

[KendoBooks widget](https://github.com/Sitefinity/feather-samples/tree/master/KendoBooksWidget)

</td>
<td>

Demonstrates how to create and use a Kendo Grid in an MVC widget. In this sample you use Kendo via wrappers for ASP.NET MVC.

</td>
</tr>
<tr>
<td>

[Customize the Content block toolbar](https://github.com/Sitefinity/feather-samples/tree/master/SimpleContentBlock)

</td>
<td>

Demonstrates how to specify which tools are available in the Kendo editor toolbar in a <em>Content block</em> widget. You can change the <em>Content block</em> toolbar globally or create your own widget designer with different set of tools in the toolbar.

</td>
</tr>
<tr>
<td>

[Single dynamic content widget](https://github.com/Sitefinity/feather-samples/tree/master/SingleDynamicContent)

</td>
<td>

Demonstrates how to create custom MVC widget for displaying single dynamic content item. The *Single Dynamic Content* widget provides the option to change the dynamic content type and the dynamic content item displayed in it in the designer through build-in `sfDynamicItemsSelector` client component.

</td>
</tr>
<tr>
<td>

[ReCaptcha widget](https://github.com/Sitefinity/feather-samples/tree/master/ReCaptcha)

</td>
<td>

Demonstrates how to add a Captcha functionality to a MVC Form widgets by including a Captcha widget that can only be used inside a form.

</td>
</tr>
<tr>
<td>

[Content with custom styles block](https://github.com/Sitefinity/feather-samples/tree/master/CustomStylesContentBlock) and

[Boldless Content block](https://github.com/Sitefinity/feather-samples/tree/master/BoldlessContentBlock)

</td>
<td>

<p>Both samples demonstrate how to override the default view for the HTML field used by the <em>Content block</em> widget designer. Specify which tools are available in the Kendo editor toolbar in a <em>Content block</em> widget. You can change the <em>Content block</em> toolbar globally or create your own widget designer with different set of tools in the toolbar.</p>

</td>
</tr>
<tr>
<td>

[Widget custom designer with dynamic content](https://github.com/Sitefinity/feather-samples/tree/master/DynamicContentWidgetCustomDesigner)

</td>
<td>

Demonstrates how to create custom designer views for dynamic content MVC widgets. This sample requires you to create a dynamic type Countries to work. It has to have a value for <em>Content type (singular)</em> set to <em>Country</em>, with two properties of type short text - Title and Continent. You can use the structure and the items for the Countries module by using the attached ZIP and XLSX files for the structure and the items, respectively.

</td>
</tr>
</tbody>
</table>
Sample	Description
[DevMagazine site](https://github.com/Sitefinity/feather-samples/tree/master/DevMagazineSite)	The website showcases how you can use the MVC framework to build an entire website from scratch. The site includes: * Mobile responsive design * Built-in widgets * Custom widgets with simplified dependency injection, use of content locations service for resolving items’ locations, Master/Detail view functionality, and so on * Frontend packages for delivering responsive design and defining all styling rules To see a detailed tutorial how to build the site, see [Create a DevMagazine site](https://www.progress.com/documentation/sitefinity-cms/tutorial-create-a-devmagazine-site-mvc).
[List widget](https://github.com/Sitefinity/feather-samples/tree/master/ListWidget)	Demonstrates how to create a simple MVC List widget. The List widget displays a list of items on the frontend and provides functionality for configurations via a customized designer. You learn how to create a MVC widget in a separate assembly that uses a custom designer. To see a detailed tutorial, see [Create a List widget](https://www.progress.com/documentation/sitefinity-cms/create-a-list-widget-mvc).
[Custom widget with multiple selectors](https://github.com/Sitefinity/feather-samples/tree/master/AuthorWidget)	Demonstrates how to create a simple MVC Author widget: Displays an author with his name and description Displays profile image Links to a page in Sitefinity and to an external page You learn how to build a complex designer leveraging the built-in client components.
[KendoBooks widget](https://github.com/Sitefinity/feather-samples/tree/master/KendoBooksWidget)	Demonstrates how to create and use a Kendo Grid in an MVC widget. In this sample you use Kendo via wrappers for ASP.NET MVC.
[Customize the Content block toolbar](https://github.com/Sitefinity/feather-samples/tree/master/SimpleContentBlock)	Demonstrates how to specify which tools are available in the Kendo editor toolbar in a Content block widget. You can change the Content block toolbar globally or create your own widget designer with different set of tools in the toolbar.
[Single dynamic content widget](https://github.com/Sitefinity/feather-samples/tree/master/SingleDynamicContent)	Demonstrates how to create custom MVC widget for displaying single dynamic content item. The Single Dynamic Content widget provides the option to change the dynamic content type and the dynamic content item displayed in it in the designer through build-in `sfDynamicItemsSelector` client component.
[ReCaptcha widget](https://github.com/Sitefinity/feather-samples/tree/master/ReCaptcha)	Demonstrates how to add a Captcha functionality to a MVC Form widgets by including a Captcha widget that can only be used inside a form.
[Content with custom styles block](https://github.com/Sitefinity/feather-samples/tree/master/CustomStylesContentBlock) and [Boldless Content block](https://github.com/Sitefinity/feather-samples/tree/master/BoldlessContentBlock)	Both samples demonstrate how to override the default view for the HTML field used by the Content block widget designer. Specify which tools are available in the Kendo editor toolbar in a Content block widget. You can change the Content block toolbar globally or create your own widget designer with different set of tools in the toolbar.
[Widget custom designer with dynamic content](https://github.com/Sitefinity/feather-samples/tree/master/DynamicContentWidgetCustomDesigner)	Demonstrates how to create custom designer views for dynamic content MVC widgets. This sample requires you to create a dynamic type Countries to work. It has to have a value for Content type (singular) set to Country, with two properties of type short text - Title and Continent. You can use the structure and the items for the Countries module by using the attached ZIP and XLSX files for the structure and the items, respectively.