diff --git a/blazor/mention/accessibility.md b/blazor/mention/accessibility.md index 7294f17f36..74bcfff51c 100644 --- a/blazor/mention/accessibility.md +++ b/blazor/mention/accessibility.md @@ -1,7 +1,7 @@ --- layout: post -title: Accessibility in Blazor Mention Component | Syncfusion -description: Checkout and learn here all about accessibility in Syncfusion Blazor Mention component and much more details. +title: Accessibility in Blazor Mention Component | Syncfusion® +description: Checkout and learn here all the features about accessibility in Blazor Mention component and much more details. platform: Blazor control: Mention documentation: ug diff --git a/blazor/mention/customization.md b/blazor/mention/customization.md index 583e57c1ba..d9a9d2dfca 100644 --- a/blazor/mention/customization.md +++ b/blazor/mention/customization.md @@ -1,7 +1,7 @@ --- layout: post -title: Customization in Blazor Mention Component | Syncfusion -description: Checkout and learn here all about customization in Syncfusion Blazor Mention component and much more. +title: Customization in Blazor Mention Component | Syncfusion® +description: Checkout and learn here all about the customization in Blazor Mention component and much more details. platform: Blazor control: Mention documentation: ug diff --git a/blazor/mention/disabled-items.md b/blazor/mention/disabled-items.md index b1769d4428..5305b624ca 100644 --- a/blazor/mention/disabled-items.md +++ b/blazor/mention/disabled-items.md @@ -1,7 +1,7 @@ --- layout: post -title: Disabled Items in Blazor Mention Component | Syncfusion -description: Checkout and learn here all about Disabled Items in Syncfusion Blazor Mention component and much more. +title: Disabled Items in Blazor Mention Component | Syncfusion® +description: Checkout and learn here all about how to Disabled Items in Blazor Mention component and much more details. platform: Blazor control: Mention documentation: ug diff --git a/blazor/mention/filtering-data.md b/blazor/mention/filtering-data.md index 94ac9a5275..a44899c2ff 100644 --- a/blazor/mention/filtering-data.md +++ b/blazor/mention/filtering-data.md @@ -1,7 +1,7 @@ --- layout: post -title: Filtering data in Blazor Mention Component | Syncfusion -description: Checkout and learn here all about filtering data in Syncfusion Blazor Mention component and much more details. +title: Filtering data in Blazor Mention Component | Syncfusion® +description: Checkout and learn here all the features about filtering data in Blazor Mention component and much more details. platform: Blazor control: Mention documentation: ug diff --git a/blazor/mention/getting-started-webapp.md b/blazor/mention/getting-started-webapp.md index 8e27fc0ba2..742d5c840f 100644 --- a/blazor/mention/getting-started-webapp.md +++ b/blazor/mention/getting-started-webapp.md @@ -1,7 +1,7 @@ --- layout: post -title: Getting started with Syncfusion Mention Component in Blazor Web App -description: Check out the documentation for getting started with Syncfusion Blazor Mention Components in Web App. +title: Getting started with Mention Component in Blazor Web App | Syncfusion® +description: Check out the documentation for getting started with Blazor Mention Components in Web App and much more details. platform: Blazor control: Mention documentation: ug @@ -21,7 +21,7 @@ This section briefly explains about how to include [Blazor Mention](https://www. ## Create a new Blazor Web App in Visual Studio -Create a **Blazor Web App** using Visual Studio via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vs) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). For detailed instructions, refer to the [Blazor Web App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-web-app) documentation. +Create a **Blazor Web App** using Visual Studio via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vs) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). For detailed instructions, refer to the [Blazor Web App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-web-app) documentation. {% endtabcontent %} @@ -33,7 +33,7 @@ Create a **Blazor Web App** using Visual Studio via [Microsoft Templates](https: ## Create a new Blazor Web App in Visual Studio Code -Create a **Blazor Web App** using Visual Studio Code via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vsc) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-code-integration/create-project). For detailed instructions, refer to the [Blazor Web App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-web-app?tabcontent=visual-studio-code) documentation. +Create a **Blazor Web App** using Visual Studio Code via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vsc) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-code-integration/create-project). For detailed instructions, refer to the [Blazor Web App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-web-app?tabcontent=visual-studio-code) documentation. For example, in a Blazor Web App with the `Auto` interactive render mode, use the following commands in the integrated terminal (Ctrl+`): @@ -85,7 +85,7 @@ cd BlazorWebApp.Client N> Configure the appropriate [Interactive render mode](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes?view=aspnetcore-10.0#render-modes) and [Interactivity location](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vs) while creating a Blazor Web App. For detailed information, refer to the [interactive render mode documentation](https://blazor.syncfusion.com/documentation/common/interactive-render-mode). -## Install Syncfusion® Blazor packages +## Install required Blazor packages Install [Syncfusion.Blazor.DropDowns](https://www.nuget.org/packages/Syncfusion.Blazor.DropDowns) and [Syncfusion.Blazor.Themes](https://www.nuget.org/packages/Syncfusion.Blazor.Themes/) NuGet packages in your project using the NuGet Package Manager in Visual Studio (*Tools → NuGet Package Manager → Manage NuGet Packages for Solution*), or the integrated terminal in Visual Studio Code (`dotnet add package`), or the .NET CLI. @@ -117,9 +117,9 @@ After the packages are installed, open the **~/_Imports.razor** file in the clie {% endhighlight %} {% endtabs %} -## Register Syncfusion® Blazor service +## Register Blazor service -Register the Syncfusion Blazor service in the **Program.cs** file of your Blazor Web App. +Register the Blazor service in the **Program.cs** file of your Blazor Web App. {% tabs %} {% highlight c# tabtitle="Program.cs" %} @@ -133,7 +133,7 @@ builder.Services.AddSyncfusionBlazor(); {% endhighlight %} {% endtabs %} -N> If the **Interactive Render Mode** is set to `WebAssembly` or `Auto`, register the Syncfusion® Blazor service in **Program.cs** files of both the server and client projects in your Blazor Web App. +N> If the **Interactive Render Mode** is set to `WebAssembly` or `Auto`, register the Blazor service in **Program.cs** files of both the server and client projects in your Blazor Web App. ## Add stylesheet and script resources @@ -149,9 +149,9 @@ The theme stylesheet and script can be accessed from NuGet through [Static Web A N> Check out the [Blazor Themes](https://blazor.syncfusion.com/documentation/appearance/themes) topic to discover various methods ([Static Web Assets](https://blazor.syncfusion.com/documentation/appearance/themes#static-web-assets), [CDN](https://blazor.syncfusion.com/documentation/appearance/themes#cdn-reference), and [CRG](https://blazor.syncfusion.com/documentation/common/custom-resource-generator)) for referencing themes in your Blazor application. Also, check out the [Adding Script Reference](https://blazor.syncfusion.com/documentation/common/adding-script-references) topic to learn different approaches for adding script references in your Blazor application. -## Add Syncfusion® Blazor Mention component +## Add Blazor Mention component -Add the Syncfusion Blazor Mention component in the **~/Components/Pages/*.razor** file. If the interactivity location is set to `Per page/component` in the Web App, define a render mode at the top of the `~/Pages/*.razor` file. (For example, `InteractiveServer`, `InteractiveWebAssembly` or `InteractiveAuto`). +Add the Blazor Mention component in the **~/Components/Pages/*.razor** file. If the interactivity location is set to `Per page/component` in the Web App, define a render mode at the top of the `~/Pages/*.razor` file. (For example, `InteractiveServer`, `InteractiveWebAssembly` or `InteractiveAuto`). N> If the **Interactivity Location** is set to `Global` with `Auto` or `WebAssembly`, the render mode is automatically configured in the `App.razor` file by default. @@ -209,7 +209,7 @@ N> If the **Interactivity Location** is set to `Global` with `Auto` or `WebAssem {% endhighlight %} {% endtabs %} -* Press ctrl+F5 or +F5 (macOS) to launch the application. This will render the Syncfusion® Blazor Mention component in the default web browser. +* Press ctrl+F5 or +F5 (macOS) to launch the application. This will render the Blazor Mention component in the default web browser. {% previewsample "https://blazorplayground.syncfusion.com/embed/VXVTNCAjLjgvQOEF?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor Mention Component](images/blazor-mention.png)" %} @@ -269,6 +269,6 @@ In the bellow example, the `Target` property of the Mention component is set to ## See also -* [Getting Started with Syncfusion® Blazor for Client-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-dotnet-cli) -* [Getting Started with Syncfusion® Blazor for Server-side in Visual Studio](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio) -* [Getting Started with Syncfusion® Blazor for Server-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-dotnet-cli) \ No newline at end of file +* [Getting Started with Blazor for Client-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-dotnet-cli) +* [Getting Started with Blazor for Server-side in Visual Studio](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio) +* [Getting Started with Blazor for Server-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-dotnet-cli) \ No newline at end of file diff --git a/blazor/mention/getting-started-with-server-app.md b/blazor/mention/getting-started-with-server-app.md index abbeaf1a6a..644fc02fc4 100644 --- a/blazor/mention/getting-started-with-server-app.md +++ b/blazor/mention/getting-started-with-server-app.md @@ -1,7 +1,7 @@ --- layout: post -title: Getting started with Syncfusion Mention Component in Blazor Server App -description: Check out the documentation for getting started with Syncfusion Blazor Mention Components in Server App. +title: Getting started with Mention in Blazor Server App | Syncfusion® +description: Check out the documentation for getting started with Blazor Mention Components in Server App and much more details. platform: Blazor control: Mention documentation: ug @@ -9,7 +9,7 @@ documentation: ug # Getting Started with Blazor Mention Component in Blazor Server App -This section briefly explains about how to include [Syncfusion® Blazor Mention](https://www.syncfusion.com/blazor-components/blazor-mention) component in a Blazor Server App using [Visual Studio](https://visualstudio.microsoft.com/vs/), [Visual Studio Code](https://code.visualstudio.com/), and the [.NET CLI](https://learn.microsoft.com/en-us/dotnet/core/tools/). +This section briefly explains about how to include [Blazor Mention](https://www.syncfusion.com/blazor-components/blazor-mention) component in a Blazor Server App using [Visual Studio](https://visualstudio.microsoft.com/vs/), [Visual Studio Code](https://code.visualstudio.com/), and the [.NET CLI](https://learn.microsoft.com/en-us/dotnet/core/tools/). {% tabcontents %} @@ -21,7 +21,7 @@ This section briefly explains about how to include [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). For detailed instructions, refer to the [Blazor Server App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio) documentation. +Create a **Blazor Server App** by using the **Blazor Web App** template in Visual Studio via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vs) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). For detailed instructions, refer to the [Blazor Server App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio) documentation. {% endtabcontent %} @@ -33,7 +33,7 @@ Create a **Blazor Server App** by using the **Blazor Web App** template in Visua ## Create a new Blazor App in Visual Studio Code -Create a **Blazor Server App** using Visual Studio Code via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vsc) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-code-integration/create-project). For detailed instructions, refer to the [Blazor Server App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio?tabcontent=visual-studio-code) documentation. +Create a **Blazor Server App** using Visual Studio Code via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vsc) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-code-integration/create-project). For detailed instructions, refer to the [Blazor Server App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio?tabcontent=visual-studio-code) documentation. Alternatively, create a Server application by using the following command in the integrated terminal (Ctrl+`). @@ -83,7 +83,7 @@ cd BlazorApp N> Configure the appropriate [Interactive render mode](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes?view=aspnetcore-10.0#render-modes) and [Interactivity location](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vs) while creating a Blazor Server App. For detailed information, refer to the [interactive render mode documentation](https://blazor.syncfusion.com/documentation/common/interactive-render-mode). -## Install Syncfusion® Blazor packages +## Install required Blazor packages Install [Syncfusion.Blazor.DropDowns](https://www.nuget.org/packages/Syncfusion.Blazor.DropDowns/) and [Syncfusion.Blazor.Themes](https://www.nuget.org/packages/Syncfusion.Blazor.Themes/) NuGet packages in your project using the NuGet Package Manager in Visual Studio (*Tools → NuGet Package Manager → Manage NuGet Packages for Solution*), or the integrated terminal in Visual Studio Code (`dotnet add package`), or the .NET CLI. @@ -113,9 +113,9 @@ After the packages are installed, open the **~/_Imports.razor** file and import {% endhighlight %} {% endtabs %} -## Register Syncfusion® Blazor service +## Register Blazor service -Register the Syncfusion® Blazor service in the **Program.cs** file of your Blazor Server App. +Register the Blazor service in the **Program.cs** file of your Blazor Server App. {% tabs %} {% highlight C# tabtitle="Program.cs" %} @@ -143,9 +143,9 @@ The theme stylesheet and script can be accessed from NuGet through [Static Web A N> Check out the [Blazor Themes](https://blazor.syncfusion.com/documentation/appearance/themes) topic to discover various methods ([Static Web Assets](https://blazor.syncfusion.com/documentation/appearance/themes#static-web-assets), [CDN](https://blazor.syncfusion.com/documentation/appearance/themes#cdn-reference), and [CRG](https://blazor.syncfusion.com/documentation/common/custom-resource-generator)) for referencing themes in Blazor application. Also, check out the [Adding Script Reference](https://blazor.syncfusion.com/documentation/common/adding-script-references) topic to learn different approaches for adding script references in Blazor application. -## Add Syncfusion® Blazor Mention component +## Add Blazor Mention component -Add the Syncfusion® Blazor Mention component in the **~/Components/Pages/Home.razor** file. If the interactivity location is set to `Per page/component`, define a render mode at the top of the `~Pages/Home.razor` file. +Add the Blazor Mention component in the **~/Components/Pages/Home.razor** file. If the interactivity location is set to `Per page/component`, define a render mode at the top of the `~Pages/Home.razor` file. N> If the Interactivity Location is set to `Global`, the render mode is automatically configured in the `App.razor` file by default. @@ -203,7 +203,7 @@ N> If the Interactivity Location is set to `Global`, the render mode is automati {% endhighlight %} {% endtabs %} -* Press ctrl+F5 or +F5 (macOS) to launch the application. This will render the Syncfusion® Blazor Mention component in the default web browser. +* Press ctrl+F5 or +F5 (macOS) to launch the application. This will render the Blazor Mention component in the default web browser. {% previewsample "https://blazorplayground.syncfusion.com/embed/VXVTNCAjLjgvQOEF?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor Mention Component](images/blazor-mention.png)" %} @@ -263,5 +263,5 @@ In the bellow example, the `Target` property of the Mention component is set to ## See also -* [Getting Started with Syncfusion® Blazor for Client-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-dotnet-cli) -* [Getting Started with Syncfusion® Blazor for Server-side in Visual Studio](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio) \ No newline at end of file +* [Getting Started with Blazor for Client-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-dotnet-cli) +* [Getting Started with Blazor for Server-side in Visual Studio](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio) \ No newline at end of file diff --git a/blazor/mention/getting-started.md b/blazor/mention/getting-started.md index d638821fac..c7ea24b6be 100644 --- a/blazor/mention/getting-started.md +++ b/blazor/mention/getting-started.md @@ -1,7 +1,7 @@ --- layout: post -title: Getting Started with Blazor Mention Component | Syncfusion -description: Checkout and learn about getting started with Blazor Mention component in Blazor WebAssembly Application. +title: Getting Started with Blazor Mention Component | Syncfusion® +description: Checkout and learn about getting started with Blazor Mention component in Blazor WebAssembly Application and much more details. platform: Blazor control: Mention documentation: ug @@ -9,7 +9,7 @@ documentation: ug # Getting Started with Blazor Mention Component -This section briefly explains about how to include [Syncfusion® Blazor Mention](https://www.syncfusion.com/blazor-components/blazor-mention) component in a Blazor WebAssembly App using [Visual Studio](https://visualstudio.microsoft.com/vs/), [Visual Studio Code](https://code.visualstudio.com/), and the [.NET CLI](https://learn.microsoft.com/en-us/dotnet/core/tools/). +This section briefly explains about how to include [Blazor Mention](https://www.syncfusion.com/blazor-components/blazor-mention) component in a Blazor WebAssembly App using [Visual Studio](https://visualstudio.microsoft.com/vs/), [Visual Studio Code](https://code.visualstudio.com/), and the [.NET CLI](https://learn.microsoft.com/en-us/dotnet/core/tools/). {% tabcontents %} @@ -21,7 +21,7 @@ This section briefly explains about how to include [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). For detailed instructions, refer to the [Blazor WASM App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-app) documentation. +Create a **Blazor WebAssembly App** using Visual Studio via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vs) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). For detailed instructions, refer to the [Blazor WASM App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-app) documentation. {% endtabcontent %} @@ -33,7 +33,7 @@ Create a **Blazor WebAssembly App** using Visual Studio via [Microsoft Templates ## Create a new Blazor App in Visual Studio Code -Create a **Blazor WebAssembly App** using Visual Studio Code via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vsc) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-code-integration/create-project). For detailed instructions, refer to the [Blazor WASM App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-app?tabcontent=visual-studio-code) documentation. +Create a **Blazor WebAssembly App** using Visual Studio Code via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vsc) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-code-integration/create-project). For detailed instructions, refer to the [Blazor WASM App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-app?tabcontent=visual-studio-code) documentation. Alternatively, create a WebAssembly application by using the following command in the integrated terminal (Ctrl+`). @@ -81,7 +81,7 @@ cd BlazorApp {% endtabcontents %} -## Install Syncfusion® Blazor packages +## Install required Blazor packages Install [Syncfusion.Blazor.DropDowns](https://www.nuget.org/packages/Syncfusion.Blazor.DropDowns/) and [Syncfusion.Blazor.Themes](https://www.nuget.org/packages/Syncfusion.Blazor.Themes/) NuGet packages in your project using the NuGet Package Manager in Visual Studio (*Tools → NuGet Package Manager → Manage NuGet Packages for Solution*), or the integrated terminal in Visual Studio Code (`dotnet add package`), or the .NET CLI. @@ -111,9 +111,9 @@ After the packages are installed, open the **~/_Imports.razor** file and import {% endhighlight %} {% endtabs %} -## Register Syncfusion® Blazor service +## Register Blazor service -Register the Syncfusion® Blazor service in the **Program.cs** file of your Blazor WebAssembly App. +Register the Blazor service in the **Program.cs** file of your Blazor WebAssembly App. {% tabs %} {% highlight C# tabtitle="Program.cs" %} @@ -141,9 +141,9 @@ The theme stylesheet and script can be accessed from NuGet through [Static Web A N> Check out the [Blazor Themes](https://blazor.syncfusion.com/documentation/appearance/themes) topic to discover various methods ([Static Web Assets](https://blazor.syncfusion.com/documentation/appearance/themes#static-web-assets), [CDN](https://blazor.syncfusion.com/documentation/appearance/themes#cdn-reference), and [CRG](https://blazor.syncfusion.com/documentation/common/custom-resource-generator)) for referencing themes in the Blazor application. Also, check out the [Adding Script Reference](https://blazor.syncfusion.com/documentation/common/adding-script-references) topic to learn different approaches for adding script references in the Blazor application. -## Add Syncfusion® Blazor Mention component +## Add Blazor Mention component -Add the Syncfusion® Blazor Mention component in the **~/Pages/Index.razor** file. +Add the Blazor Mention component in the **~/Pages/Index.razor** file. {% tabs %} {% highlight razor tabtitle="Index.razor" %} @@ -190,7 +190,7 @@ Add the Syncfusion® Blazor Mention componen {% endhighlight %} {% endtabs %} -* Press ctrl+F5 or +F5 (macOS) to launch the application. This will render the Syncfusion® Blazor Mention component in the default web browser. +* Press ctrl+F5 or +F5 (macOS) to launch the application. This will render the Blazor Mention component in the default web browser. {% previewsample "https://blazorplayground.syncfusion.com/embed/VXVTNCAjLjgvQOEF?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor Mention Component](images/blazor-mention.png)" %} @@ -248,6 +248,6 @@ In the bellow example, the `Target` property of the Mention component is set to ## See also -* [Getting Started with Syncfusion® Blazor for Client-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-dotnet-cli) -* [Getting Started with Syncfusion® Blazor for Server-side in Visual Studio](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio) -* [Getting Started with Syncfusion® Blazor for Server-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-dotnet-cli) +* [Getting Started with Blazor for Client-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-dotnet-cli) +* [Getting Started with Blazor for Server-side in Visual Studio](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio) +* [Getting Started with Blazor for Server-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-dotnet-cli) diff --git a/blazor/mention/localization.md b/blazor/mention/localization.md index 01aa00d379..f31b1e97c6 100644 --- a/blazor/mention/localization.md +++ b/blazor/mention/localization.md @@ -1,7 +1,7 @@ --- layout: post -title: Localization in Blazor Mention Component | Syncfusion -description: Checkout and learn here all about localization in Syncfusion Blazor Mention component and more. +title: Localization in Blazor Mention Component | Syncfusion® +description: Checkout and learn here all the features about localization in Blazor Mention component and much more details. platform: Blazor control: Mention documentation: ug @@ -11,7 +11,7 @@ documentation: ug ## Localization -The [Blazor Mention](https://www.syncfusion.com/blazor-components/blazor-mention) component can be localized. Refer to the [Blazor Localization](https://blazor.syncfusion.com/documentation/common/localization) topic to localize Syncfusion® Blazor components. +The [Blazor Mention](https://www.syncfusion.com/blazor-components/blazor-mention) component can be localized. Refer to the [Blazor Localization](https://blazor.syncfusion.com/documentation/common/localization) topic to localize Blazor components. ## See also diff --git a/blazor/mention/sorting.md b/blazor/mention/sorting.md index 15b724f7bf..2322e5186b 100644 --- a/blazor/mention/sorting.md +++ b/blazor/mention/sorting.md @@ -1,7 +1,7 @@ --- layout: post -title: Sorting in Blazor Mention Component | Syncfusion -description: Checkout and learn here all about sorting in Syncfusion Blazor Mention component and much more. +title: Sorting in Blazor Mention Component | Syncfusion® +description: Checkout and learn here all the features about sorting in Blazor Mention component and much more details. platform: Blazor control: Mention documentation: ug diff --git a/blazor/mention/style-and-customizations.md b/blazor/mention/style-and-customizations.md index 1e3b7b8f1f..5a98cd3eb8 100644 --- a/blazor/mention/style-and-customizations.md +++ b/blazor/mention/style-and-customizations.md @@ -1,7 +1,7 @@ --- layout: post -title: Style and Customization in Blazor Mention Component | Syncfusion -description: Checkout and learn here all about Style and Customization in Syncfusion Blazor Mention component and much more. +title: Style and Customization in Blazor Mention Component | Syncfusion® +description: Checkout and learn here all the features about Style and Customization in Blazor Mention component and much more details. platform: Blazor control: Mention documentation: ug diff --git a/blazor/mention/templates.md b/blazor/mention/templates.md index 538f3c79b9..2fab3f8789 100644 --- a/blazor/mention/templates.md +++ b/blazor/mention/templates.md @@ -1,7 +1,7 @@ --- layout: post -title: Templates in Blazor Mention Component | Syncfusion -description: Checkout and learn here all about templates in Syncfusion Blazor Mention component and much more details. +title: Templates in Blazor Mention Component | Syncfusion® +description: Checkout and learn here all the features about templates in Blazor Mention component and much more details. platform: Blazor control: Mention documentation: ug diff --git a/blazor/mention/working-with-data.md b/blazor/mention/working-with-data.md index 134ab461b1..a490a921da 100644 --- a/blazor/mention/working-with-data.md +++ b/blazor/mention/working-with-data.md @@ -1,7 +1,7 @@ --- layout: post -title: Working with data in Blazor Mention Component | Syncfusion -description: Checkout and learn here all about working with data in Syncfusion Blazor Mention component and more. +title: Working with data in Blazor Mention Component | Syncfusion® +description: Checkout and learn here all the features about working with data in Blazor Mention component and much more details. platform: Blazor control: Mention documentation: ug @@ -122,7 +122,7 @@ The following sample displays the first 6 contacts from `Customers` table of the ### Web API adaptor -The [Web Api Adaptor](https://blazor.syncfusion.com/documentation/data/adaptors#web-api-adaptor) is used to interact with Web API created under OData standards. The `WebApiAdaptor` is extended from the [ODataAdaptor](https://blazor.syncfusion.com/documentation/data/adaptors#odata-adaptor). Hence to use the `WebApiAdaptor`, the endpoint should understand the OData formatted queries sent along with the request. +The [Web API Adaptor](https://blazor.syncfusion.com/documentation/data/adaptors#web-api-adaptor) is used to interact with Web API created under OData standards. The `WebApiAdaptor` is extended from the [ODataAdaptor](https://blazor.syncfusion.com/documentation/data/adaptors#odata-adaptor). Hence to use the `WebApiAdaptor`, the endpoint should understand the OData formatted queries sent along with the request. {% highlight razor %} @@ -134,7 +134,7 @@ The [Web Api Adaptor](https://blazor.syncfusion.com/documentation/data/adaptors# ### Offline mode -The `Offline` property of `DataManager` allows you to specify whether the data should be loaded from the server or from the local cache. If `Offline` is set to `true`, the `DataManager` will try to load data from the local cache first, and if that is not possible, it will try to load it from the server. This can be useful in situations where you want to minimise the number of requests to the server and improve its performance. +The `Offline` property of `DataManager` allows you to specify whether the data should be loaded from the server or from the local cache. If `Offline` is set to `true`, the `DataManager` will try to load data from the local cache first, and if that is not possible, it will try to load it from the server. This can be useful in situations where you want to minimize the number of requests to the server and improve its performance. The following example is for remote data binding and enabled `Offline` mode. @@ -172,7 +172,7 @@ The [OnActionComplete](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.D The [OnActionFailure](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.DropDowns.SfMention-1.html#Syncfusion_Blazor_DropDowns_SfMention_1_OnActionFailure) event is a built-in event of Mention component that is triggered when an error occurs while fetching data from a remote server. This event can be used to handle errors that may occur during the data fetch process and take appropriate action, such as displaying an error message or retrying the request. -In the following example, the `Url` is set to an incorrect value, So the server is unable to fulfil the data fetch request, and it will triggers the `OnActionFailure` event. +In the following example, the `Url` is set to an incorrect value, So the server is unable to fulfill the data fetch request, and it will triggers the `OnActionFailure` event. {% highlight razor %} diff --git a/blazor/menu-bar/accessibility.md b/blazor/menu-bar/accessibility.md index b28c63fac7..e7c5c5205b 100644 --- a/blazor/menu-bar/accessibility.md +++ b/blazor/menu-bar/accessibility.md @@ -1,7 +1,7 @@ --- layout: post -title: Accessibility in Blazor Menu Bar Component | Syncfusion -description: Checkout and learn here all about accessibility in Syncfusion Blazor Menu Bar component and much more. +title: Accessibility in Blazor Menu Bar Component | Syncfusion® +description: Checkout and learn here all the features about accessibility in Blazor Menu Bar component and much more details. platform: Blazor control: Menu Bar documentation: ug @@ -74,4 +74,5 @@ The accessibility compliance of the Blazor Menu Bar component is shown in the fo ## See also -* [Accessibility in Syncfusion® Blazor components](https://blazor.syncfusion.com/documentation/common/accessibility) \ No newline at end of file +* [Accessibility in Blazor components](https://blazor.syncfusion.com/documentation/common/accessibility) + diff --git a/blazor/menu-bar/animation.md b/blazor/menu-bar/animation.md index 16aca70c9a..61c33c94fd 100644 --- a/blazor/menu-bar/animation.md +++ b/blazor/menu-bar/animation.md @@ -1,7 +1,7 @@ --- layout: post -title: Animation in Blazor Menu Bar Component | Syncfusion -description: Checkout and learn here all about Change animation settings in Syncfusion Blazor ContextMenu component and more. +title: Animation in Blazor Menu Bar Component | Syncfusion® +description: Checkout and learn here all about Change animation settings in Blazor ContextMenu component and much more details. platform: Blazor control: Context Menu documentation: ug diff --git a/blazor/menu-bar/data-source-binding-and-custom-menu-items.md b/blazor/menu-bar/data-source-binding-and-custom-menu-items.md index 56f6811e57..3f1927dc19 100644 --- a/blazor/menu-bar/data-source-binding-and-custom-menu-items.md +++ b/blazor/menu-bar/data-source-binding-and-custom-menu-items.md @@ -1,7 +1,7 @@ --- layout: post -title: DataSource Binding and Custom Items in Blazor Menu Bar | Syncfusion -description: Learn here all about data source binding and custom items in Syncfusion Blazor Menu Bar component and more. +title: DataSource Binding and Custom Items in Blazor Menu Bar | Syncfusion® +description: Learn here all about data source binding and custom items in Blazor Menu Bar component and much more details. platform: Blazor control: Menu Bar documentation: ug diff --git a/blazor/menu-bar/getting-started-webapp.md b/blazor/menu-bar/getting-started-webapp.md index 5c2c432c02..dc7c4d3226 100644 --- a/blazor/menu-bar/getting-started-webapp.md +++ b/blazor/menu-bar/getting-started-webapp.md @@ -1,7 +1,7 @@ --- layout: post -title: Getting Started with Web App in Blazor Menu Bar | Syncfusion -description: Check out the documentation for getting started with Syncfusion Blazor Menu Bar Components in Web App. +title: Getting Started with Web App in Blazor Menu Bar | Syncfusion® +description: Check out the documentation for getting started with Blazor Menu Bar Components in Web App and much more details. platform: Blazor control: Menu Bar documentation: ug @@ -9,7 +9,7 @@ documentation: ug # Getting Started with Blazor Menu Bar in Blazor Web App -This section briefly explains about how to include [Syncfusion® Blazor Menu Bar](https://www.syncfusion.com/blazor-components/blazor-menu-bar) component in your Blazor Web App using [Visual Studio](https://visualstudio.microsoft.com/vs/), [Visual Studio Code](https://code.visualstudio.com/), and the [.NET CLI](https://learn.microsoft.com/en-us/dotnet/core/tools/). +This section briefly explains about how to include [Blazor Menu Bar](https://www.syncfusion.com/blazor-components/blazor-menu-bar) component in your Blazor Web App using [Visual Studio](https://visualstudio.microsoft.com/vs/), [Visual Studio Code](https://code.visualstudio.com/), and the [.NET CLI](https://learn.microsoft.com/en-us/dotnet/core/tools/). {% tabcontents %} @@ -21,7 +21,7 @@ This section briefly explains about how to include [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). For detailed instructions, refer to the [Blazor Web App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-web-app) documentation. +Create a **Blazor Web App** using Visual Studio via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vs) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). For detailed instructions, refer to the [Blazor Web App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-web-app) documentation. {% endtabcontent %} @@ -33,7 +33,7 @@ Create a **Blazor Web App** using Visual Studio via [Microsoft Templates](https: ## Create a new Blazor Web App in Visual Studio Code -Create a **Blazor Web App** using Visual Studio Code via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vsc) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-code-integration/create-project). For detailed instructions, refer to the [Blazor Web App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-web-app?tabcontent=visual-studio-code) documentation. +Create a **Blazor Web App** using Visual Studio Code via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vsc) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-code-integration/create-project). For detailed instructions, refer to the [Blazor Web App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-web-app?tabcontent=visual-studio-code) documentation. For example, in a Blazor Web App with the `Auto` interactive render mode, use the following commands in the integrated terminal (Ctrl+`): @@ -85,7 +85,7 @@ cd BlazorWebApp.Client N> Configure the appropriate [Interactive render mode](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes?view=aspnetcore-10.0#render-modes) and [Interactivity location](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vs) while creating a Blazor Web App. For detailed information, refer to the [interactive render mode documentation](https://blazor.syncfusion.com/documentation/common/interactive-render-mode). -## Install Syncfusion® Blazor packages +## Install required Blazor packages Install [Syncfusion.Blazor.Navigations](https://www.nuget.org/packages/Syncfusion.Blazor.Navigations) and [Syncfusion.Blazor.Themes](https://www.nuget.org/packages/Syncfusion.Blazor.Themes/) NuGet packages in your project using the NuGet Package Manager in Visual Studio (*Tools → NuGet Package Manager → Manage NuGet Packages for Solution*), or the integrated terminal in Visual Studio Code (`dotnet add package`), or the .NET CLI. @@ -117,9 +117,9 @@ After the packages are installed, open the **~/_Imports.razor** file in the clie {% endhighlight %} {% endtabs %} -## Register Syncfusion® Blazor service +## Register Blazor service -Register the Syncfusion Blazor service in the **Program.cs** file of your Blazor Web App. +Register the Blazor service in the **Program.cs** file of your Blazor Web App. {% tabs %} {% highlight c# tabtitle="Program.cs" %} @@ -133,7 +133,7 @@ builder.Services.AddSyncfusionBlazor(); {% endhighlight %} {% endtabs %} -N> If the **Interactive Render Mode** is set to `WebAssembly` or `Auto`, register the Syncfusion® Blazor service in **Program.cs** files of both the server and client projects in your Blazor Web App. +N> If the **Interactive Render Mode** is set to `WebAssembly` or `Auto`, register the Blazor service in **Program.cs** files of both the server and client projects in your Blazor Web App. ## Add stylesheet and script resources @@ -149,9 +149,9 @@ The theme stylesheet and script can be accessed from NuGet through [Static Web A N> Check out the [Blazor Themes](https://blazor.syncfusion.com/documentation/appearance/themes) topic to discover various methods ([Static Web Assets](https://blazor.syncfusion.com/documentation/appearance/themes#static-web-assets), [CDN](https://blazor.syncfusion.com/documentation/appearance/themes#cdn-reference), and [CRG](https://blazor.syncfusion.com/documentation/common/custom-resource-generator)) for referencing themes in your Blazor application. Also, check out the [Adding Script Reference](https://blazor.syncfusion.com/documentation/common/adding-script-references) topic to learn different approaches for adding script references in your Blazor application. -## Add Syncfusion® Blazor Menu Bar component +## Add Blazor Menu Bar component -Add the Syncfusion Blazor Menu Bar component in the **~/Components/Pages/*.razor** file. If the interactivity location is set to `Per page/component` in the Web App, define a render mode at the top of the `~/Pages/*.razor` file. (For example, `InteractiveServer`, `InteractiveWebAssembly` or `InteractiveAuto`). +Add the Blazor Menu Bar component in the **~/Components/Pages/*.razor** file. If the interactivity location is set to `Per page/component` in the Web App, define a render mode at the top of the `~/Pages/*.razor` file. (For example, `InteractiveServer`, `InteractiveWebAssembly` or `InteractiveAuto`). N> If the **Interactivity Location** is set to `Global` with `Auto` or `WebAssembly`, the render mode is automatically configured in the `App.razor` file by default. @@ -207,7 +207,7 @@ N> If the **Interactivity Location** is set to `Global` with `Auto` or `WebAssem {% endhighlight %} {% endtabs %} -* Press Ctrl+F5 (Windows) or +F5 (macOS) to launch the application. This will render the Syncfusion® Blazor Menu Bar component in the default web browser. +* Press Ctrl+F5 (Windows) or +F5 (macOS) to launch the application. This will render the Blazor Menu Bar component in the default web browser. {% previewsample "https://blazorplayground.syncfusion.com/embed/rZhfDiUNVjEteVaW?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor MenuBar Component](./images/blazor-menubar.webp)" %} @@ -217,8 +217,8 @@ N> `TValue` can be specified as either `MenuItemModel` or `MenuItem`. If the men ## See also -* [Getting Started with Syncfusion® Blazor for Client-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-dotnet-cli) -* [Getting Started with Syncfusion® Blazor for Server-Side in Visual Studio](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio) -* [Getting Started with Syncfusion® Blazor for Server-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-dotnet-cli) +* [Getting Started with Blazor for Client-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-dotnet-cli) +* [Getting Started with Blazor for Server-Side in Visual Studio](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio) +* [Getting Started with Blazor for Server-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-dotnet-cli) N> You can also explore our [blazor menu bar example](https://blazor.syncfusion.com/demos/menu-bar/default-functionalities?theme=bootstrap5) that shows you how to render and configure the menu bar. diff --git a/blazor/menu-bar/getting-started-with-server-app.md b/blazor/menu-bar/getting-started-with-server-app.md index f02322728b..07818db314 100644 --- a/blazor/menu-bar/getting-started-with-server-app.md +++ b/blazor/menu-bar/getting-started-with-server-app.md @@ -1,7 +1,7 @@ --- layout: post -title: Getting Started with Server App in Blazor Menu Bar | Syncfusion -description: Check out the documentation for getting started with Syncfusion Blazor Menu Bar Components in Server App. +title: Getting Started with Server App in Blazor Menu Bar | Syncfusion® +description: Check out the documentation for getting started with Blazor Menu Bar Components in Server App and much more details. platform: Blazor control: Menu Bar documentation: ug @@ -9,7 +9,7 @@ documentation: ug # Getting Started with Blazor Menu Bar Component in Blazor Server App -This section briefly explains about how to include [Syncfusion® Blazor Menu Bar](https://www.syncfusion.com/blazor-components/blazor-menu-bar) component in a Blazor Server App using [Visual Studio](https://visualstudio.microsoft.com/vs/), [Visual Studio Code](https://code.visualstudio.com/), and the [.NET CLI](https://learn.microsoft.com/en-us/dotnet/core/tools/). +This section briefly explains about how to include [Blazor Menu Bar](https://www.syncfusion.com/blazor-components/blazor-menu-bar) component in a Blazor Server App using [Visual Studio](https://visualstudio.microsoft.com/vs/), [Visual Studio Code](https://code.visualstudio.com/), and the [.NET CLI](https://learn.microsoft.com/en-us/dotnet/core/tools/). {% tabcontents %} @@ -21,7 +21,7 @@ This section briefly explains about how to include [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). For detailed instructions, refer to the [Blazor Server App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio) documentation. +Create a **Blazor Server App** by using the **Blazor Web App** template in Visual Studio via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vs) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). For detailed instructions, refer to the [Blazor Server App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio) documentation. {% endtabcontent %} @@ -33,7 +33,7 @@ Create a **Blazor Server App** by using the **Blazor Web App** template in Visua ## Create a new Blazor App in Visual Studio Code -Create a **Blazor Server App** using Visual Studio Code via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vsc) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-code-integration/create-project). For detailed instructions, refer to the [Blazor Server App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio?tabcontent=visual-studio-code) documentation. +Create a **Blazor Server App** using Visual Studio Code via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vsc) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-code-integration/create-project). For detailed instructions, refer to the [Blazor Server App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio?tabcontent=visual-studio-code) documentation. Alternatively, create a Server application by using the following command in the integrated terminal (Ctrl+`). @@ -83,7 +83,7 @@ cd BlazorApp N> Configure the appropriate [Interactive render mode](https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes?view=aspnetcore-10.0#render-modes) and [Interactivity location](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vs) while creating a Blazor Server App. For detailed information, refer to the [interactive render mode documentation](https://blazor.syncfusion.com/documentation/common/interactive-render-mode). -## Install Syncfusion® Blazor packages +## Install required Blazor packages Install [Syncfusion.Blazor.Navigations](https://www.nuget.org/packages/Syncfusion.Blazor.Navigations/) and [Syncfusion.Blazor.Themes](https://www.nuget.org/packages/Syncfusion.Blazor.Themes/) NuGet packages in your project using the NuGet Package Manager in Visual Studio (*Tools → NuGet Package Manager → Manage NuGet Packages for Solution*), or the integrated terminal in Visual Studio Code (`dotnet add package`), or the .NET CLI. @@ -113,9 +113,9 @@ After the packages are installed, open the **~/_Imports.razor** file and import {% endhighlight %} {% endtabs %} -## Register Syncfusion® Blazor service +## Register Blazor service -Register the Syncfusion® Blazor service in the **Program.cs** file of your Blazor Server App. +Register the Blazor service in the **Program.cs** file of your Blazor Server App. {% tabs %} {% highlight C# tabtitle="Program.cs" %} @@ -143,9 +143,9 @@ The theme stylesheet and script can be accessed from NuGet through [Static Web A N> Check out the [Blazor Themes](https://blazor.syncfusion.com/documentation/appearance/themes) topic to discover various methods ([Static Web Assets](https://blazor.syncfusion.com/documentation/appearance/themes#static-web-assets), [CDN](https://blazor.syncfusion.com/documentation/appearance/themes#cdn-reference), and [CRG](https://blazor.syncfusion.com/documentation/common/custom-resource-generator)) for referencing themes in Blazor application. Also, check out the [Adding Script Reference](https://blazor.syncfusion.com/documentation/common/adding-script-references) topic to learn different approaches for adding script references in Blazor application. -## Add Syncfusion® Blazor Menu Bar component +## Add Blazor Menu Bar component -Add the Syncfusion® Blazor Menu Bar component in the **~/Components/Pages/Home.razor** file. If the interactivity location is set to `Per page/component`, define a render mode at the top of the `~Pages/Home.razor` file. +Add the Blazor Menu Bar component in the **~/Components/Pages/Home.razor** file. If the interactivity location is set to `Per page/component`, define a render mode at the top of the `~Pages/Home.razor` file. N> If the Interactivity Location is set to `Global`, the render mode is automatically configured in the `App.razor` file by default. @@ -201,7 +201,7 @@ N> If the Interactivity Location is set to `Global`, the render mode is automati {% endhighlight %} {% endtabs %} -* Press Ctrl+F5 (Windows) or +F5 (macOS) to launch the application. This will render the Syncfusion® Blazor Menu Bar component in the default web browser. +* Press Ctrl+F5 (Windows) or +F5 (macOS) to launch the application. This will render the Blazor Menu Bar component in the default web browser. {% previewsample "https://blazorplayground.syncfusion.com/embed/rZhfDiUNVjEteVaW?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor MenuBar Component](./images/blazor-menubar.webp)" %} @@ -211,8 +211,8 @@ N> `TValue` can be specified as either `MenuItemModel` or `MenuItem`. If the men ## See also -* [Getting Started with Syncfusion® Blazor for Client-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-dotnet-cli) -* [Getting Started with Syncfusion® Blazor for Server-Side in Visual Studio](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio) -* [Getting Started with Syncfusion® Blazor for Server-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-dotnet-cli) +* [Getting Started with Blazor for Client-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-dotnet-cli) +* [Getting Started with Blazor for Server-Side in Visual Studio](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio) +* [Getting Started with Blazor for Server-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-dotnet-cli) N> You can also explore our [Blazor Menu Bar sample](https://blazor.syncfusion.com/demos/menu-bar/default-functionalities?theme=bootstrap5) that shows you how to render and configure the menu bar. diff --git a/blazor/menu-bar/getting-started.md b/blazor/menu-bar/getting-started.md index f1fc169cd1..e84443e543 100644 --- a/blazor/menu-bar/getting-started.md +++ b/blazor/menu-bar/getting-started.md @@ -1,7 +1,7 @@ --- layout: post -title: Getting Started with Blazor Menu Bar Component | Syncfusion -description: Checkout and learn about getting started with Blazor Menu Bar component in Blazor WebAssembly Application. +title: Getting Started with Blazor Menu Bar Component | Syncfusion® +description: Checkout and learn about getting started with Blazor Menu Bar component in Blazor WebAssembly Application and much more details. platform: Blazor control: Menu Bar documentation: ug @@ -9,7 +9,7 @@ documentation: ug # Getting Started with Blazor Menu Bar Component -This section briefly explains about how to include [Syncfusion® Blazor Menu Bar](https://www.syncfusion.com/blazor-components/blazor-menu-bar) component in a Blazor WebAssembly App using [Visual Studio](https://visualstudio.microsoft.com/vs/), [Visual Studio Code](https://code.visualstudio.com/), and the [.NET CLI](https://learn.microsoft.com/en-us/dotnet/core/tools/). +This section briefly explains about how to include [Blazor Menu Bar](https://www.syncfusion.com/blazor-components/blazor-menu-bar) component in a Blazor WebAssembly App using [Visual Studio](https://visualstudio.microsoft.com/vs/), [Visual Studio Code](https://code.visualstudio.com/), and the [.NET CLI](https://learn.microsoft.com/en-us/dotnet/core/tools/). {% tabcontents %} @@ -21,7 +21,7 @@ This section briefly explains about how to include [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). For detailed instructions, refer to the [Blazor WASM App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-app) documentation. +Create a **Blazor WebAssembly App** using Visual Studio via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vs) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-integration/template-studio). For detailed instructions, refer to the [Blazor WASM App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-app) documentation. {% endtabcontent %} @@ -33,7 +33,7 @@ Create a **Blazor WebAssembly App** using Visual Studio via [Microsoft Templates ## Create a new Blazor App in Visual Studio Code -Create a **Blazor WebAssembly App** using Visual Studio Code via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vsc) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-code-integration/create-project). For detailed instructions, refer to the [Blazor WASM App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-app?tabcontent=visual-studio-code) documentation. +Create a **Blazor WebAssembly App** using Visual Studio Code via [Microsoft Templates](https://learn.microsoft.com/en-us/aspnet/core/blazor/tooling?view=aspnetcore-10.0&pivots=vsc) or the [Syncfusion® Blazor Extension](https://blazor.syncfusion.com/documentation/visual-studio-code-integration/create-project). For detailed instructions, refer to the [Blazor WASM App Getting Started](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-app?tabcontent=visual-studio-code) documentation. Alternatively, create a WebAssembly application by using the following command in the integrated terminal (Ctrl+`). @@ -81,7 +81,7 @@ cd BlazorApp {% endtabcontents %} -## Install Syncfusion® Blazor packages +## Install required Blazor packages Install [Syncfusion.Blazor.Navigations](https://www.nuget.org/packages/Syncfusion.Blazor.Navigations/) and [Syncfusion.Blazor.Themes](https://www.nuget.org/packages/Syncfusion.Blazor.Themes/) NuGet packages in your project using the NuGet Package Manager in Visual Studio (*Tools → NuGet Package Manager → Manage NuGet Packages for Solution*), or the integrated terminal in Visual Studio Code (`dotnet add package`), or the .NET CLI. @@ -111,9 +111,9 @@ After the packages are installed, open the **~/_Imports.razor** file and import {% endhighlight %} {% endtabs %} -## Register Syncfusion® Blazor service +## Register Blazor service -Register the Syncfusion® Blazor service in the **Program.cs** file of your Blazor WebAssembly App. +Register the Blazor service in the **Program.cs** file of your Blazor WebAssembly App. {% tabs %} {% highlight C# tabtitle="Program.cs" %} @@ -141,9 +141,9 @@ The theme stylesheet and script can be accessed from NuGet through [Static Web A N> Check out the [Blazor Themes](https://blazor.syncfusion.com/documentation/appearance/themes) topic to discover various methods ([Static Web Assets](https://blazor.syncfusion.com/documentation/appearance/themes#static-web-assets), [CDN](https://blazor.syncfusion.com/documentation/appearance/themes#cdn-reference), and [CRG](https://blazor.syncfusion.com/documentation/common/custom-resource-generator)) for referencing themes in the Blazor application. Also, check out the [Adding Script Reference](https://blazor.syncfusion.com/documentation/common/adding-script-references) topic to learn different approaches for adding script references in the Blazor application. -## Add Syncfusion® Blazor Menu Bar component +## Add Blazor Menu Bar component -Add the Syncfusion® Blazor Menu Bar component in the **~/Pages/Index.razor** file. +Add the Blazor Menu Bar component in the **~/Pages/Index.razor** file. {% tabs %} {% highlight razor tabtitle="Index.razor" %} @@ -188,7 +188,7 @@ Add the Syncfusion® Blazor Menu Bar compone {% endhighlight %} {% endtabs %} -* Press Ctrl+F5 (Windows) or +F5 (macOS) to launch the application. This will render the Syncfusion® Blazor Menu Bar component in the default web browser. +* Press Ctrl+F5 (Windows) or +F5 (macOS) to launch the application. This will render the Blazor Menu Bar component in the default web browser. {% previewsample "https://blazorplayground.syncfusion.com/embed/rZhfDiUNVjEteVaW?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor MenuBar Component](./images/blazor-menubar.webp)" %} @@ -198,8 +198,8 @@ N> [View sample in GitHub](https://github.com/SyncfusionExamples/Blazor-Getting- ## See also -* [Getting Started with Syncfusion® Blazor for Client-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-app) -* [Getting Started with Syncfusion® Blazor for Server-Side in Visual Studio](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio) -* [Getting Started with Syncfusion® Blazor for Server-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-web-app) +* [Getting Started with Blazor for Client-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-app) +* [Getting Started with Blazor for Server-Side in Visual Studio](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio) +* [Getting Started with Blazor for Server-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-web-app) N> You can also explore our [blazor menu bar example](https://blazor.syncfusion.com/demos/menu-bar/default-functionalities?theme=bootstrap5) that shows you how to render and configure the menu bar. diff --git a/blazor/menu-bar/how-to/change-orientation.md b/blazor/menu-bar/how-to/change-orientation.md index ef04baf339..d693948760 100644 --- a/blazor/menu-bar/how-to/change-orientation.md +++ b/blazor/menu-bar/how-to/change-orientation.md @@ -1,7 +1,7 @@ --- layout: post -title: Change Orientation in Blazor Menu Bar Component | Syncfusion -description: Checkout and learn here all about change orientation in Syncfusion Blazor Menu Bar component and more. +title: Change Orientation in Blazor Menu Bar Component | Syncfusion® +description: Checkout and learn here all the features about change orientation in Blazor Menu Bar component and much more details. platform: Blazor control: Menu Bar documentation: ug diff --git a/blazor/menu-bar/how-to/change-submenu-position.md b/blazor/menu-bar/how-to/change-submenu-position.md index 38dcd46c96..1b638d8afd 100644 --- a/blazor/menu-bar/how-to/change-submenu-position.md +++ b/blazor/menu-bar/how-to/change-submenu-position.md @@ -1,7 +1,7 @@ --- layout: post -title: Change Submenu Position in Blazor Menu Bar | Syncfusion -description: Checkout and learn about Change Submenu Position in Blazor Menu Bar component of Syncfusion, and more details. +title: Change Submenu Position in Blazor Menu Bar | Syncfusion® +description: Checkout and learn about Change Submenu Position in Blazor Menu Bar component and much more details. platform: Blazor control: Menu Bar documentation: ug diff --git a/blazor/menu-bar/how-to/customize-menu-items.md b/blazor/menu-bar/how-to/customize-menu-items.md index 37583b9cab..1e8703aa2d 100644 --- a/blazor/menu-bar/how-to/customize-menu-items.md +++ b/blazor/menu-bar/how-to/customize-menu-items.md @@ -1,7 +1,7 @@ --- layout: post -title: Customize Menu Bar Items in Blazor Menu Bar Component | Syncfusion -description: Checkout and learn here all about how to customize menu bar items in Syncfusion Blazor Menu Bar component and more. +title: Customize Menu Bar Items in Blazor Menu Bar Component | Syncfusion® +description: Checkout and learn here all about how to customize menu bar items in Blazor Menu Bar component and much more details. platform: Blazor control: Menu Bar documentation: ug diff --git a/blazor/menu-bar/how-to/menu-with-rounded-corner.md b/blazor/menu-bar/how-to/menu-with-rounded-corner.md index d4a0405db4..dc2a871c93 100644 --- a/blazor/menu-bar/how-to/menu-with-rounded-corner.md +++ b/blazor/menu-bar/how-to/menu-with-rounded-corner.md @@ -1,7 +1,7 @@ --- layout: post -title: Menu Bar with Rounded Corner in Blazor Menu Bar Component | Syncfusion -description: Checkout and learn here all about menu bar with rounded corner in Syncfusion Blazor Menu Bar component and more. +title: Menu Bar with Rounded Corner in Blazor Menu Bar | Syncfusion® +description: Checkout and learn here all about menu bar with rounded corner in Blazor Menu Bar component and much more details. platform: Blazor control: Menu Bar documentation: ug diff --git a/blazor/menu-bar/how-to/right-left.md b/blazor/menu-bar/how-to/right-left.md index a4839014bf..43a0f60c3b 100644 --- a/blazor/menu-bar/how-to/right-left.md +++ b/blazor/menu-bar/how-to/right-left.md @@ -1,7 +1,7 @@ --- layout: post -title: Right to Left in Blazor Menu Bar Component | Syncfusion -description: Checkout and learn here all about right to left in Syncfusion Blazor Menu Bar component and much more. +title: Right to Left in Blazor Menu Bar Component | Syncfusion® +description: Checkout and learn here all the features about right to left in Blazor Menu Bar component and much more details. platform: Blazor control: Menu Bar documentation: ug diff --git a/blazor/menu-bar/icons.md b/blazor/menu-bar/icons.md index 6a0ac11696..7a30dc45f3 100644 --- a/blazor/menu-bar/icons.md +++ b/blazor/menu-bar/icons.md @@ -1,7 +1,7 @@ --- layout: post -title: Icons and submenu Items in Blazor Menu Bar Component | Syncfusion -description: Checkout and learn here all about icons and submenu items in Syncfusion Blazor Menu Bar component and more. +title: Icons and submenu Items in Blazor Menu Bar Component | Syncfusion® +description: Checkout and learn here all about icons and submenu items in Blazor Menu Bar component and much more details. platform: Blazor control: Menu Bar documentation: ug diff --git a/blazor/menu-bar/menu-events.md b/blazor/menu-bar/menu-events.md index 7efd0a0932..527f4af9f2 100644 --- a/blazor/menu-bar/menu-events.md +++ b/blazor/menu-bar/menu-events.md @@ -1,7 +1,7 @@ --- layout: post -title: Menu Bar Events in Blazor Menu Bar | Syncfusion -description: Checkout and learn here all about Events in the Syncfusion Blazor MenuBar component and much more details. +title: Menu Bar Events in Blazor Menu Bar | Syncfusion® +description: Checkout and learn here all the features about Events in the Blazor MenuBar component and much more details. platform: Blazor control: Menu Bar documentation: ug diff --git a/blazor/menu-bar/style-and-appearance.md b/blazor/menu-bar/style-and-appearance.md index eea025f626..71f17afa0a 100644 --- a/blazor/menu-bar/style-and-appearance.md +++ b/blazor/menu-bar/style-and-appearance.md @@ -1,7 +1,7 @@ --- layout: post -title: Styles and Appearances in Blazor Menu Bar Component | Syncfusion -description: Checkout and learn here all about styles and appearances in Syncfusion Blazor Menu Bar component and more. +title: Styles and Appearances in Blazor Menu Bar Component | Syncfusion® +description: Checkout and learn here all the features about styles and appearances in Blazor Menu Bar component and much more details. platform: Blazor control: Menu Bar documentation: ug diff --git a/blazor/menu-bar/usecase-scenario.md b/blazor/menu-bar/usecase-scenario.md index e9803798c3..5664111dae 100644 --- a/blazor/menu-bar/usecase-scenario.md +++ b/blazor/menu-bar/usecase-scenario.md @@ -1,7 +1,7 @@ --- layout: post -title: Use Case Scenarios in Blazor Menu Bar Component | Syncfusion -description: Checkout and learn here all about use case scenarios in Syncfusion Blazor Menu Bar component and more. +title: Use Case Scenarios in Blazor Menu Bar Component | Syncfusion® +description: Checkout and learn here all about use case scenarios in Blazor Menu Bar component and much more details. platform: Blazor control: Menu Bar documentation: ug