Giter Site home page Giter Site logo

kontent-sample-app-net-master's Introduction

Kentico Kontent sample ASP.NET Core MVC web application

Build status Stack Overflow Deploy to Azure

This is a sample ASP.NET Core MVC app that uses the Kentico Kontent Delivery .NET SDK to retrieve content from Kentico Kontent.

Getting started

To run the app:

  1. Clone the app repository with your favorite GIT client

  2. Open the DancingGoat.sln solution file in VS or VS Code

  3. Run the app

  4. Follow the setup wizard or

  5. Alternatively, adjust the \DancingGoat\appsettings.json file:

    "DeliveryOptions": {
    	"ProjectId": "YOUR_PROJECT_ID",
    },

Tutorial

Follow the step-by-step tutorial for even more details.

Features

Edit mode & preview

Content contributors sometimes need to fix errors or typos right when they see them on the website. The sample app allows users to navigate from a piece of content on the site straight to the corresponding content item or element in Kentico Kontent.

To see Edit mode in action:

  1. Enable Delivery Preview API by adding the following keys to the \DancingGoat\appsettings.json file:

    "DeliveryOptions": {
    	"UsePreviewApi": true,
    	"PreviewApiKey": "YOUR_DELIVERY_PREVIEW_API_KEY"
    },
    • Delivery Preview API: Create a new key named PreviewApiKey in the DeliveryOptions section, and use the Delivery Preview API key as its value. To enable calls over the Delivery Preview API, you also need to add a key named UsePreviewApi and set it to true.
  2. Run the app.

  3. Navigate to the About us section.

  4. Click the Edit mode switch in the bottom-left corner.

Edit buttons will appear next to each piece of content on the page.

To explore how the functionality is implemented, navigate to the TagHelpers folder.

Responsive images

The sample app contains a sample implementation of the img-asset tag helper from the Kentico.Kontent.AspNetCore NuGet package. Using the img-asset tag helper, you can easily create an img tag with srcset and sizes attributes. Read more about image transformation API in the docs. You can adjust the behavir in the appsettings.json file.

"ImageTransformationOptions": {
  "ResponsiveWidths": [ 200, 400, 600, 800, 1000, 1200, 1400, 1600, 2000, 4000 ]
},

Localized routing

The app demonstrates the usage of the Kentico.AspNetCore.LocalizedRouting NuGet package for localizing URLs for SEO purposes.

Get involved

Check out the contributing page to see the best places to file issues, start discussions, and begin contributing.

Analytics

kontent-sample-app-net-master's People

Contributors

haceneaz300 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.