Skip to main content

Configuration

Note:​

The Home page should be configured using the "Healthcare 3 Setup" extension to ensure that the required lists and libraries are created automatically. Without this configuration, users will need to manually create dedicated lists or libraries for the respective web parts.

Configuration settings for each web part.

πŸ§ͺ1. Site config (Application customizer)​

Steps to Test and Apply Template​

  1. On the SharePoint site, locate the new icon in the top suite bar (on the right side of the header bar). This icon opens the design template panel.

  2. Click the icon to open the Page creation Panel.

  3. In the panel:

    • Select the "Home Page" template

    • Click the Create Page button

  4. Do not close or refresh the browser. A pop-up will appear to create the required lists and libraries:

  • Appointments list
  • QuickLinks list
  • Anniversaries list
  • Mindfulness list
  • Events list
  • TrainingVideos library
  • Facilities list (_Mock items are added automatically for QuickLinks, Appoinments, Anniversaries, Mindfulness, News, TrainingVideos, Facilities)
  1. After the items are created, the site page will refresh automatically, and it will continue to creating page and adding webparts.

  2. Once setup is complete, a button will appear to open the newly created homepage. Click it to view the result.


πŸ‘‹ 2. Welcome Banner​

πŸ“‹ Details​

  • Personalized Greeting Web Part: Displays a dynamic welcome message with the logged-in user’s name along with the current date and time..
  • Announcements Display: Highlights important updates with preview text and a β€œRead More” option for detailed information.
  • Custom Background Support: Allows a professional background image to enhance the visual appearance of the banner.
  • Draggable Components:Enables repositioning of banner elements for flexible layout customization.

Welcome Banner


☰ General Settings​

This section allows customization of the welcome text, user display format, and layout behavior. The following configurable options are available:

πŸ“Έ View Property Pane Screenshots

General Settings

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ‘‹ Welcome TextCustomizes the greeting text displayed before the user name.Welcome,
πŸ‘€ User Name FormatDefines how the logged-in user’s name appears (e.g., First name)First name
πŸ•’ Date and Time FormatControls the display format of the current date and time.Not Selected
🧩 Enable Draggable ComponentsAllows repositioning of components within the layout.Disabled
πŸ”„ Reset Component PositionsRestores layout to its default state.Button
πŸ–ΌοΈ Select Background ImageUploads or changes the background image.Not Selected

πŸ“’ Announcement Settings​

This section allows customization of announcement title, message, and visibility options.

πŸ“Έ View Property Pane Screenshots

Announcement Settings

πŸ“ Announcement Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
🏷️ TitleDefines the heading of the announcement section.VISION
πŸ“ DescriptionDisplays the main announcement message to users.Our vision is to restore your vision!
πŸ”— Show Read More LinkToggles visibility of an additional β€œRead More” link.No

🎨 Appearance Settings​

πŸ“Έ View Property Pane Screenshots

Appearance settings

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ“ HeightAdjusts the height of the component/container.500

ℹ️ About Section​

πŸ“Έ View Property Pane Screenshots

About settings

🏷️ Name🎯 Purpose
πŸ‘¨β€πŸ’»Developer InfoIndicates the web part is developed bySharePoint Designs.
πŸ“šDocumentation LinkProvides access to user and admin documentation for further guidance.
πŸ”‘Activate License ButtonA button to activate the premium or licensed version of the web part, if applicable.

πŸ“Š 3. KPI Appointments Settings​

πŸ“‹ Details​

This web part provides a quick overview of key appointment metrics in a visually structured layout.

  • KPI Metrics Display: Shows important appointment statistics such as daily, next day, and monthly bookings.
  • Real-Time Insights: Displays dynamic counts to help track appointment trends and performance.
  • Clean Card Layout: Presents data in a horizontal card format with clear separation for each metric.
  • Highlighted Values: Uses visually distinct badges to emphasize key numbers for quick readability.
  • Customizable Title: Includes a configurable header section (e.g., KPI Appointments).

Assist


πŸ“Œ Header Settings​

This section allows customization of the web part header including title, heading level, and background image.

πŸ“Έ View Property Pane Screenshots

Header Settings

🧾 Header Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ“ TitleDefines the title displayed at the top of the web part.KPI Appointments
πŸ”€ Heading LevelSets the semantic heading level for the title (e.g., H1–H6).Heading 4
πŸ–ΌοΈ Background ImageUploads or selects a background image for the header section.Select Image

🧱 Layout Settings​

This section allows configuration of data source and layout filtering options.

πŸ“Έ View Property Pane Screenshots

Layout Settings

πŸ“‚ Layout Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ“‹ Select a ListChooses the SharePoint list used as the data source.Appointments
πŸ” Filter LayoutDefines the layout or category view for displaying the data.Appointments

βš™οΈ General Settings​

This section allows configuration of automatic scrolling behavior.

πŸ“Έ View Property Pane Screenshots

General Settings

πŸ”„ Behavior Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ” Enable Auto ScrollToggles automatic scrolling of content within the web part.Off

ℹ️ About Section​

πŸ“Έ View Property Pane Screenshots

About settings

🏷️ Name🎯 Purpose
πŸ‘¨β€πŸ’»Developer InfoIndicates the web part is developed by SharePoint Designs.
πŸ“šDocumentation LinkProvides access to user and admin documentation for further guidance.
πŸ”‘Activate License ButtonA button to activate the premium or licensed version of the web part, if applicable.

πŸ“‹ Details​

This web part provides quick access to important resources and frequently used links in a clean, card-based layout.

  • Quick Navigation: Displays commonly used links for easy and fast access.
  • Icon-Based Representation: Each link is visually represented with an icon for better recognition.
  • Card Layout Design: Presents links in a structured and responsive card format.
  • Customizable Links: Allows configuration of link titles, icons, and navigation URLs.
  • User-Friendly Interface: Ensures a simple and intuitive experience for end users.

Quicklinks


πŸ“Œ Header Settings​

This section allows customization of the web part header including title, heading level, background image, and visibility.

πŸ“Έ View Property Pane Screenshots

Header Settings

🧾 Header Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ“ WebPart TitleDefines the title displayed at the top of the web part.Quick Links
πŸ”€ Heading LevelSets the semantic heading level for the title (e.g., H1–H6).Heading 2
πŸ–ΌοΈ Background ImageUploads or selects a background image for the header section.Select Image
πŸ‘οΈ Show TitleToggles visibility of the web part title.On

βš™οΈ General Settings​

This section allows configuration of data source, list selection, and number of items to display.

πŸ“Έ View Property Pane Screenshots

General Settings

πŸ“‚ Data Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ—‚οΈ Select Data SourceChooses the source type for fetching data (e.g., SharePoint List).SharePoint List
πŸ“‹ Select ListSelects the list from which quick links are retrieved.QuickLinks
πŸ”’ No of Items DisplayControls the number of links displayed in the web part.6
πŸ”— View ListProvides quick navigation to view the selected SharePoint list.Link

🎨 Appearance Settings​

This section allows customization of visual styles such as border radius, colors, and icon display.

πŸ“Έ View Property Pane Screenshots

Appearance Settings

πŸ–ŒοΈ Style Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ”² Border Radius (px)Adjusts the roundness of the card corners.14
🌈 Hide GradientToggles visibility of gradient background effects.Off
🎨 Hide Shade ColorToggles display of shade/overlay color on cards.Off
🎯 Hover & Text ColorsAllows selection of predefined color themes for hover and text.Custom Theme
πŸ–ΌοΈ Show Only Icon/ImageDisplays only icon/image without text when enabled.Off
πŸ”  Icon SizeControls the size of icons displayed in the cards.Medium

πŸ› οΈ Admin Settings​

This section allows control over admin-specific options and visibility.

πŸ“Έ View Property Pane Screenshots

Admin Settings

πŸ” Admin Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ‘οΈ Show Admin MenuToggles visibility of the admin menu for managing quick links.Hide

ℹ️ About Section​

πŸ“Έ View Property Pane Screenshots

About settings

🏷️ Name🎯 Purpose
πŸ‘¨β€πŸ’»Developer InfoIndicates the web part is developed bySharePoint Designs.
πŸ“šDocumentation LinkProvides access to user and admin documentation for further guidance.
πŸ”‘Activate License ButtonA button to activate the premium or licensed version of the web part, if applicable.

πŸ“° 5. Latest News​

Showcase concise company updates in a clean, minimal layout. Integrates with SharePoint news or RSS feeds.

News Preview


βš™οΈ Configuration​

πŸ“° Header Settings​

This section allows customization of the Latest News web part header, including title, visibility, background, and navigation options.

πŸ“Έ View Property Pane Screenshots

Header Settings

🧾 Header Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ‘οΈ Hide TitleToggles visibility of the web part title.Show
πŸ“ Webpart TitleDefines the title displayed at the top of the web part.Latest News
πŸ”€ Heading LevelSets the semantic heading level for the title (e.g., H1–H6).Heading 2
πŸ–ΌοΈ Header ImageDisplays or uploads an image/icon for the header.latestNews.png
πŸŒ„ Background ImageUploads or selects a background image for the header section.Select Image
πŸ”˜ Show See All ButtonToggles visibility of the β€œSee All” navigation button.On
πŸ”— See All LinkDefines the navigation URL for the β€œSee All” button.{siteUrl}/_layouts/15/news.aspx

🧱 Layout Settings​

This section allows selection of the layout style for displaying news content.

πŸ“Έ View Property Pane Screenshots

Layout Settings

πŸ“° Layout Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
🧩 Choose LayoutSelects the layout style used to display news items.News 2

βš™οΈ General Settings​

This section allows configuration of news sources, audience targeting, and category filtering.

πŸ“Έ View Property Pane Screenshots

General Settings

πŸ“° News Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ” Search SitesAllows searching and selecting SharePoint sites as news sources.1 Website Selected
πŸ‘₯ Target AudienceDefines audience targeting for displaying specific news content.Not Selected
πŸ—‚οΈ News CategoryFilters news posts based on selected category.Not Selected
πŸ”— Manage News PostsProvides quick navigation to manage news content.Link

🎨 Appearance Settings​

This section allows customization of visual styling such as borders and shadows.

πŸ“Έ View Property Pane Screenshots

Appearance Settings

πŸ–ŒοΈ Style Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ”² Show BorderToggles visibility of border around the web part.Off
πŸŒ‘ Show ShadowToggles shadow effect for better visual depth.On

ℹ️ About Section​

πŸ“Έ View Property Pane Screenshots

About settings

🏷️ Name🎯 Purpose
πŸ‘¨β€πŸ’»Developer InfoIndicates the web part is developed bySharePoint Designs.
πŸ“šDocumentation LinkProvides access to user and admin documentation for further guidance.
πŸ”‘Activate License ButtonA button to activate the premium or licensed version of the web part, if applicable.

πŸ‘ 6. Kudos​

πŸ“‹ Details​

This web part highlights employee recognition, celebrations, and appreciation moments in an engaging card layout.

  • Employee Recognition : Displays kudos, achievements, or special occasions like birthdays.
  • Highlight Card Design : Uses a visually appealing card to spotlight an individual.
  • Personalized Message : Shows custom messages such as birthday wishes or appreciation notes.
  • Quick Action Button : Includes a β€œSend Appreciation” button to encourage user interaction.
  • See All Navigation : Provides a β€œSee all” option to view more recognition posts.
  • User-Friendly Layout : Ensures a clean and engaging experience for end users.

Kudos

βš™οΈ Configuration​

πŸ“Œ Header Settings​

This section allows customization of the Kudos web part header, including visibility, title, navigation, and background.

πŸ“Έ View Property Pane Screenshots

Header Settings

🧾 Header Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ‘οΈ Header VisibilityToggles visibility of the web part header.Show Header
πŸ”˜ Show See All ButtonToggles visibility of the β€œSee All” navigation button.On
πŸ”— See All LinkDefines the navigation URL for the β€œSee All” button.{siteUrl}/_layouts/15/news.aspx
πŸ“ Web Part TitleDefines the title displayed at the top of the web part.Kudos
πŸ”€ Heading LevelSets the semantic heading level for the title (e.g., H1–H6).Heading 2
πŸ–ΌοΈ Background ImageUploads or selects a background image for the header section.Select Image

βš™οΈ General Settings​

This section allows configuration of data source, time-based filtering, and category options for the Kudos web part.

πŸ“Έ View Property Pane Screenshots

General Settings

πŸ“‚ Data Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ“‹ Select ListChooses the SharePoint list used to fetch kudos or anniversary data.Anniversaries
πŸ”— View ListProvides quick navigation to view the selected SharePoint list.Anniversaries
⏳ Filter the PeriodFilters entries based on selected time range (e.g., Today, This Month).Next Month
🧩 Show Category Filter ButtonsToggles visibility of category filter buttons in the UI.Off
πŸ—‚οΈ Filter by CategoryFilters content by specific category (e.g., Birthday, Anniversary).All

🎨 Appearance Settings​

This section allows customization of visual styles such as borders, shadows, and background images.

πŸ“Έ View Property Pane Screenshots

Appearance Settings

πŸ–ŒοΈ Style Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ”² Show BorderToggles visibility of the border around the component.Disable Border
πŸŒ‘ Show Shadow on BorderEnables or disables shadow effect on the border.Disable Shadow
πŸ”˜ Border Radius (px)Adjusts the roundness of the border corners.Not Set
πŸŒ„ Enable Background Image 1Toggles background image usage for the component.Disabled
πŸ–ΌοΈ Background Image 1Uploads or selects a background image.Not Selected
🚩 Enable Top Flag ImageToggles visibility of a top flag image element.Disabled
🏳️ Top Flag ImageUploads or selects a top flag image.Not Selected

This section allows configuration of carousel behavior such as auto play and speed.

πŸ“Έ View Property Pane Screenshots

Carousel Settings

🏷️ Name🎯 PurposeπŸ’‘ Select Option
▢️ Enable Auto PlayToggles automatic sliding of carousel items.Disabled
⏱️ Auto Play Speed (seconds)Controls the delay between each slide transition.5

πŸ› οΈ Admin Settings​

This section allows control over admin-specific options and visibility.

πŸ“Έ View Property Pane Screenshots

Admin Settings

πŸ” Admin Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ‘οΈ Show Admin MenuToggles visibility of the admin menu for managing content.Hide

ℹ️ About Section​

πŸ“Έ View Property Pane Screenshots

About settings

🏷️ Name🎯 Purpose
πŸ‘¨β€πŸ’»Developer InfoIndicates the web part is developed by SharePoint Designs.
πŸ“šDocumentation LinkProvides access to user and admin documentation for further guidance.
πŸ”‘Activate License ButtonA button to activate the premium or licensed version of the web part, if applicable.

🧘7. Mindfullness​

πŸ“‹ Details​

This web part promotes mindfulness and well-being by displaying calming techniques and guided exercises in a structured layout.

  • Mindfulness Techniques: Displays guided exercises like grounding techniques for mental wellness.
  • Structured Content Display: Presents steps clearly (e.g., 5-4-3-2-1 technique) for easy understanding.
  • Engaging UI: Uses icons and cards to represent each step interactively.
  • Customizable Content: Allows configuration of title, description, and resource list.
  • Resource Integration: Fetches mindfulness items dynamically from a selected SharePoint list.
  • User-Friendly Design: Ensures a clean and calming experience for end users.

Mindfullness


πŸ“Œ Header Settings​

This section allows customization of the web part header including title, visibility, and background.

πŸ“Έ View Property Pane Screenshots

Header Settings

🧾 Header Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ‘οΈ Header VisibilityToggles visibility of the web part header.Show Header
πŸ“ Web Part TitleDefines the title displayed at the top of the web part.Mindfullness
πŸ”€ Heading LevelSets the semantic heading level for the title (e.g., H1–H6).Heading 2
πŸ–ΌοΈ Header ImageDisplays or uploads an image/icon for the header.MindfullnessBreak.png
πŸŒ„ Background ImageUploads or selects a background image for the header section.Select Image

🧠 Content Settings​

This section allows customization of the main content displayed in the web part.

πŸ“Έ View Property Pane Screenshots

Content Settings

πŸ“ Content Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
🏷️ Header TitleDefines the main heading of the mindfulness content.5 - 4 - 3 - 2 - 1 - Grounding Technique
πŸ“ Description TextDisplays supporting description for the technique.A calming technique that connects you with the present.

πŸ“‚ Resource List Settings​

This section allows selection of the data source for mindfulness resources.

πŸ“Έ View Property Pane Screenshots

Resource List Settings

πŸ“‹ Resource Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ“š Select Resource ListChooses the SharePoint list used to fetch mindfulness items.Mindfullness

ℹ️ About​

This section provides information about the web part version and documentation.

πŸ“Έ View Property Pane Screenshots

About settings

πŸ“Œ About Information​

🏷️ Name🎯 PurposeπŸ’‘ Value
πŸ‘¨β€πŸ’» Developed ByDisplays the developer or organization name.SharePoint Designs
πŸ“„ DocumentationProvides link to web part documentation.Available
🧾 VersionDisplays the current version of the web part.1.0.0.0

πŸŽ₯ 8.Training Videos​

πŸ“‹ Details​

This web part showcases training videos in a visually engaging card layout with category-based filtering and playback options.

  • Video Library Display: Displays training videos from selected document libraries.
  • Category-Based Filtering: Allows users to filter videos by categories such as General Ophthalmology, Surgical Procedures, etc.
  • Interactive Video Cards: Shows thumbnails, views count, date, and description for each video.
  • Play Overlay UI: Includes a play button overlay for quick video access.
  • Dynamic Content Loading: Fetches videos dynamically from SharePoint libraries.
  • User-Friendly Layout: Ensures a clean and responsive viewing experience.

TrainingVideos


πŸ“Œ Header Settings​

This section allows customization of the web part header including title, visibility, and navigation options.

πŸ“Έ View Property Pane Screenshots

Header Settings

🧾 Header Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ‘οΈ Show Webpart TitlesToggles visibility of the web part title.Yes
πŸ–ΌοΈ Header Icon/ImageDisplays or uploads an icon/image for the header.TrainingVidoes.png
πŸŒ„ Background ImageUploads or selects a background image for the header section.Select Image
πŸ“ TitleDefines the title displayed at the top of the web part.Training Videos
πŸ”€ Heading LevelSets the semantic heading level for the title (e.g., H1–H6).Heading 2
πŸ”˜ Show See All ButtonToggles visibility of the β€œSee All” navigation button.On
πŸ”— See All LinkDefines the navigation URL for the β€œSee All” button.Configured Link

🧱 Layout Settings​

This section allows configuration of data source and library selection.

πŸ“Έ View Property Pane Screenshots

Layout Settings

πŸ“‚ Layout Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ“‘ SourceDefines the source of videos (e.g., document library).A document library on this site
πŸ“š Select LibrariesChooses libraries from which videos are fetched.TrainingVideos
πŸ”’ Number of Items to DisplayControls how many videos are shown in the web part.Not Set

🎨 Appearance Settings​

This section allows customization of layout, visibility, and display options.

πŸ“Έ View Property Pane Screenshots

πŸ–ŒοΈ Style Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸŒ‘ Enable ShadowToggles shadow effect for visual depth.On
πŸ“ Use Full WidthAdjusts layout width to full container or auto width.Auto width
πŸ“ Show TitleToggles visibility of video titles.On
πŸ–ΌοΈ Show ThumbnailDisplays video thumbnail images.On
πŸ“ Show Folder NameToggles display of folder/library name.No
🎯 Category Filter AlignmentAligns category filter buttons (Left, Center, Right).Left
πŸ”’ Number of Items SliderControls number of items displayed via slider.Configured
πŸ”½ Sort Documents ByDefines sorting order for videos.Created (default)
πŸ”— Open Files in New TabOpens video links in a new browser tab.New tab
πŸ‘€ Show AuthorToggles display of video author details.Off
πŸ—‚οΈ Filter by File TypeFilters videos based on file type.Not Selected

ℹ️ About​

This section provides information about the web part version and documentation.

πŸ“Έ View Property Pane Screenshots

πŸ“Œ About Information​

🏷️ Name🎯 PurposeπŸ’‘ Value
πŸ‘¨β€πŸ’» Developed ByDisplays the developer or organization name.SharePoint Designs
πŸ“„ DocumentationProvides link to web part documentation.Available
🧾 VersionDisplays the current version of the web part.1.0.0.0

πŸ“† 9. Calendar​

πŸ“‹ Details​

This web part provides a structured calendar view to manage and display events with filtering and quick access options.

  • Event Management: Displays events from a selected SharePoint list.
  • Calendar View: Provides an interactive calendar to visualize events by date.
  • Event Filtering: Supports filtering events such as upcoming or past events.
  • Quick Actions: Includes options to add and edit events directly.
  • Dynamic Data Display: Fetches event data dynamically from SharePoint.
  • User-Friendly Interface: Ensures a clean and intuitive calendar experience.

Calendar


πŸ“Œ Header Settings​

This section allows customization of the web part header including title, visibility, and navigation.

πŸ“Έ View Property Pane Screenshots

Header Settings

🧾 Header Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ“ WebPart TitleDefines the title displayed at the top of the web part.Calendar
πŸ”€ Heading LevelSets the semantic heading level for the title (e.g., H1–H6).Heading 2
πŸ‘οΈ Hide TitleToggles visibility of the web part title.Show
πŸŒ„ Background ImageUploads or selects a background image for the header section.Select Image
πŸ”˜ Show See All LinkToggles visibility of the β€œSee All” navigation link.Hide
πŸ”— View All URLDefines the navigation URL for viewing all events.{siteUrl}/_layouts/15/Events.aspx?...

🧠 Content Settings​

This section allows configuration of event source, display options, and filtering.

πŸ“Έ View Property Pane Screenshots

Content Settings

πŸ“‚ Content Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ“‘ Select the Option EventsDefines the source type for events.Events from SharePoint List
πŸ“‹ Select Events ListChooses the SharePoint list used to fetch events.Events
βž• Add New EventProvides quick action to create a new event.Available
✏️ Edit EventsProvides quick action to edit existing events.Available
πŸ”² Show BorderToggles border visibility around the calendar component.On
πŸ“… Show CalendarToggles visibility of the calendar view.Yes
πŸ” Filter EventsFilters events based on criteria (e.g., upcoming events).Upcoming Events

πŸ› οΈ Admin Settings​

This section allows control over admin-specific options.

πŸ“Έ View Property Pane Screenshots

Admin Settings

πŸ” Admin Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ‘οΈ Show Admin MenuToggles visibility of the admin menu for managing events.Hide

ℹ️ About​

This section provides information about the web part version and documentation.

πŸ“Έ View Property Pane Screenshots

About Settings

πŸ“Œ About Information​

🏷️ Name🎯 PurposeπŸ’‘ Value
πŸ‘¨β€πŸ’» Developed ByDisplays the developer or organization name.SharePoint Designs
πŸ“„ DocumentationProvides link to web part documentation.Available
🧾 VersionDisplays the current version of the web part.1.0.0.0

πŸ₯ 10. Locations​

πŸ“‹ Details​

This web part displays organizational locations or facilities in a visually rich card layout with quick navigation options.

  • Location Showcase: Displays facility details with image, name, and location.
  • Card-Based Layout: Uses a clean and modern card UI for better visual presentation.
  • Quick Navigation: Includes a β€œView Location” button for easy access.
  • Dynamic Data Source: Fetches location details from a SharePoint list.
  • User-Friendly Design: Ensures a simple and intuitive browsing experience.

Location


πŸ“Œ Header Settings​

This section allows customization of the web part header including title, visibility, and background.

πŸ“Έ View Property Pane Screenshots

🧾 Header Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ“ WebPart TitleDefines the title displayed at the top of the web part.Locations
πŸ‘οΈ Hide TitleToggles visibility of the web part title.Show
πŸ–ΌοΈ Header Icon/ImageDisplays or uploads an icon/image for the header.KudosSpeaker.png
πŸŒ„ Background ImageUploads or selects a background image for the header section.Select Image

🧠 Content Settings​

This section allows configuration of the data source for locations.

πŸ“Έ View Property Pane Screenshots

Content Settings

πŸ“‚ Content Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ“‹ Select Facilities ListChooses the SharePoint list used to fetch location details.Facilities
βž• Add/Update List ItemProvides quick action to manage location entries.Available

🧱 Layout Settings​

This section allows configuration of navigation and display options.

πŸ“Έ View Property Pane Screenshots

Layout Settings

πŸ“ Layout Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ”— See All LinkDefines the navigation URL to view all locations.{siteUrl}/Lists/Facilities/AllItems.aspx
πŸ”˜ Show View All ButtonToggles visibility of the β€œView All” button.On
🏒 Show All FacilitiesToggles display of all facilities without filtering.Off

πŸ› οΈ Admin Settings​

This section allows control over admin-specific options.

πŸ“Έ View Property Pane Screenshots

Admin Settings

πŸ” Admin Configuration​

🏷️ Name🎯 PurposeπŸ’‘ Select Option
πŸ‘οΈ Show Admin MenuToggles visibility of the admin menu for managing locations.Hide

ℹ️ About​

This section provides information about the web part version and documentation.

πŸ“Έ View Property Pane Screenshots

About settings

πŸ“Œ About Information​

🏷️ Name🎯 PurposeπŸ’‘ Value
πŸ‘¨β€πŸ’» Developed ByDisplays the developer or organization name.SharePoint Designs
πŸ“„ DocumentationProvides link to web part documentation.Available
🧾 VersionDisplays the current version of the web part.1.0.0.0