From 768c28f4a2788b6003a882c2243425990c8d1ba5 Mon Sep 17 00:00:00 2001 From: Vivek Vishal Date: Fri, 2 May 2025 20:11:34 +0530 Subject: [PATCH 01/17] Create contributing-video.md Signed-off-by: Vivek Vishal --- content/en/contributing-video.md | 12 ++++++++++++ 1 file changed, 12 insertions(+) create mode 100644 content/en/contributing-video.md diff --git a/content/en/contributing-video.md b/content/en/contributing-video.md new file mode 100644 index 00000000..e14ac668 --- /dev/null +++ b/content/en/contributing-video.md @@ -0,0 +1,12 @@ +--- +title: Video page creation guide +--- + +Category: +Create a direcoty under `content/en/video` like `category` and add `_index.md` + + + +### Frontmatters: + + From da4cde66c833839af4db7195f42d5a4fcd317f4a Mon Sep 17 00:00:00 2001 From: Vivek Vishal Date: Mon, 5 May 2025 22:23:19 +0530 Subject: [PATCH 02/17] Update contributing-video.md Signed-off-by: Vivek Vishal --- content/en/contributing-video.md | 21 +++++++++++++++++++-- 1 file changed, 19 insertions(+), 2 deletions(-) diff --git a/content/en/contributing-video.md b/content/en/contributing-video.md index e14ac668..7bb28564 100644 --- a/content/en/contributing-video.md +++ b/content/en/contributing-video.md @@ -1,12 +1,29 @@ --- title: Video page creation guide --- +- a section is a directory having `_index.md` and that `_index.md` at least having + +``` +--- +--- +``` Category: -Create a direcoty under `content/en/video` like `category` and add `_index.md` +Create a direcoty under `content/en/videos` like `getting-started` and add `_index.md` inside it, this constitues a top-level category and a section. +inside `_indexm.md`, include following frontmatter: + +```yaml +title: Getting Started # the category text on /videos category tab +description: > + Getting started videos on Cloud and Kanvas +linkTitle: Getting Started +weight: 2 # the order in which it should appear in /videos landing page and docs view +icon: bi-rocket-takeoff-fill # icon for the category, suppots bootstrap icons, as well as local or remote assets +videoGrid: true # show all child / nested videos as grid of cards on the section's index page. for example here the videoGrid: true will show all videos inside getting-started/** as grid of video cards, ommiting of or setting it to false, presents a hyperlinked list of videos / sub-sections +``` +now we can either create a sub-section or just drop simple vidoes, -### Frontmatters: From 9df2449e2c8bbc6ef88c6a77cf0ffac64c7be2ea Mon Sep 17 00:00:00 2001 From: vishalvivekm <110674407+vishalvivekm@users.noreply.github.com> Date: Tue, 6 May 2025 19:32:40 +0530 Subject: [PATCH 03/17] update Signed-off-by: vishalvivekm <110674407+vishalvivekm@users.noreply.github.com> --- content/en/contributing-video.md | 29 ------- content/en/videos/template-category/_index.md | 10 +++ .../template-category/sub-category/_index.md | 4 + .../template-category/sub-category/video-1.md | 15 ++++ contributing.md | 75 +++++++++++++++++++ 5 files changed, 104 insertions(+), 29 deletions(-) delete mode 100644 content/en/contributing-video.md create mode 100644 content/en/videos/template-category/_index.md create mode 100644 content/en/videos/template-category/sub-category/_index.md create mode 100644 content/en/videos/template-category/sub-category/video-1.md create mode 100644 contributing.md diff --git a/content/en/contributing-video.md b/content/en/contributing-video.md deleted file mode 100644 index 7bb28564..00000000 --- a/content/en/contributing-video.md +++ /dev/null @@ -1,29 +0,0 @@ ---- -title: Video page creation guide ---- -- a section is a directory having `_index.md` and that `_index.md` at least having - -``` ---- ---- -``` - -Category: -Create a direcoty under `content/en/videos` like `getting-started` and add `_index.md` inside it, this constitues a top-level category and a section. -inside `_indexm.md`, include following frontmatter: - -```yaml -title: Getting Started # the category text on /videos category tab -description: > - Getting started videos on Cloud and Kanvas -linkTitle: Getting Started -weight: 2 # the order in which it should appear in /videos landing page and docs view -icon: bi-rocket-takeoff-fill # icon for the category, suppots bootstrap icons, as well as local or remote assets -videoGrid: true # show all child / nested videos as grid of cards on the section's index page. for example here the videoGrid: true will show all videos inside getting-started/** as grid of video cards, ommiting of or setting it to false, presents a hyperlinked list of videos / sub-sections -``` - -now we can either create a sub-section or just drop simple vidoes, - - - - diff --git a/content/en/videos/template-category/_index.md b/content/en/videos/template-category/_index.md new file mode 100644 index 00000000..8a7754fd --- /dev/null +++ b/content/en/videos/template-category/_index.md @@ -0,0 +1,10 @@ +--- +title: Template # the category text on /videos category tab and docs view in left sidebar +description: > + Template Videos for contributing videos docs +weight: 4 # the order in which this category should appear in /videos landing page category tab and and docs view in left sidebar +icon: bi-rocket-takeoff-fill # can use any bootstrap icon or a custom icon +videoGrid: true # show all child / nested videos as grid of cards on the section's index page. for example here the videoGrid: true will show all videos inside getting-started/** as grid of video cards, ommiting of or setting it to false, presents a hyperlinked list of videos / sub-sections + +draft: true # can be set to true to hide the section from the left sidebar and /videos landing page on published site, it will still be visible in the local dev server +--- \ No newline at end of file diff --git a/content/en/videos/template-category/sub-category/_index.md b/content/en/videos/template-category/sub-category/_index.md new file mode 100644 index 00000000..d41945f1 --- /dev/null +++ b/content/en/videos/template-category/sub-category/_index.md @@ -0,0 +1,4 @@ +--- +title: Sub Category +videoGrid: true # same as described in ../_index.md +--- \ No newline at end of file diff --git a/content/en/videos/template-category/sub-category/video-1.md b/content/en/videos/template-category/sub-category/video-1.md new file mode 100644 index 00000000..15992dbd --- /dev/null +++ b/content/en/videos/template-category/sub-category/video-1.md @@ -0,0 +1,15 @@ +--- +title: "Design Reviews: Adding Comments 1" # required, title of the video card / list +description: > #required, description of the video card + Add comments to your designs in Kanvas's Designer Mode to enhance collaboration and streamline design reviews. +video_id: "" # required, youtube video ID, example: bb6J--aApk8 +videoType: youtube # required, we also support "local" for local videos, but it's currenlty disabled. + +# categories and tags are used to match videos with documentation pages, by scoring the relevance of the video to the documentation page. +categories: [] # example: [Designer] +tags: [] # example: [review, collaboration, comments] # also available as hyperlinked tags in the video card as well as on individual video page +duration: 2:30 # optional, duration of the video in minutes:seconds format, "min" is automatically appended the duration +--- + +{{< youtube id=video_id class="youtube-embed-container" >}} + \ No newline at end of file diff --git a/contributing.md b/contributing.md new file mode 100644 index 00000000..69bdae7e --- /dev/null +++ b/contributing.md @@ -0,0 +1,75 @@ +--- +title: Template # the category text on /videos category tab +description: > + Template Videos for contributing videos docs +weight: 1 +icon: bi-rocket-takeoff-fill # can use any bootstrap icon or a custom icon +# videoGrid: true # show all child / nested videos as grid of cards on the section's index page. for example here the videoGrid: true will show all videos inside getting-started/** as grid of video cards, ommiting of or setting it to false, presents a hyperlinked list of videos / sub-sections + +--- + + +- A section is a directory having `_index.md` in Hugo. +- contributing vidoe involves, creating a category -> subcategory -> video markdown files, or adding a video markdown file directly under a subcategory. + +Category: +Create a direcoty under `content/en/videos` like `getting-started` and add `_index.md` inside it, this constitues a top-level category and a section. +inside `_index.md`, include following frontmatter: + +```yaml +title: Getting Started # the category text on /videos category tab and docs view in left sidebar +description: > + Getting started videos on Cloud and Kanvas +weight: 2 # the order in which this category should appear in /videos page category tab and and docs view in left sidebar +icon: bi-rocket-takeoff-fill # icon for the category, suppots bootstrap icons, as well as local or remote assets +videoGrid: true # show all child / nested videos as grid of cards on this section's index page. for example here the videoGrid: true will show all videos inside getting-started/** as grid of video cards, ommiting of or setting it to false, presents a hyperlinked list of videos / sub-sections instead. +``` + +There are two ways to add videos to a category: + +### Creating a subcategory and adding videos to it + +create a subcategory under `getting-started` like `onboarding` and add `_index.md` inside it, this constitues a subcategory and a section. + + +1. Create a subcategory section +Create a subdirectory under `getting-started` like `onboarding` and add `_index.md` inside it. + +```yaml +title: Onboarding # the sub-category text on /videos subccategory tab and docs view in left sidebar +videoGrid: true # same as above +weight: 2 # the order in which this sub-category should appear in /videos page subcategory tab and and docs view in left sidebar +``` + +now this subcategory is ready to a hve videos added to it. + +2. Create video markdown files here e.g. `video1.md`, `video2.md` etc. with the following frontmatter: + +```yaml +--- +title: "Design Reviews: Adding Comments 1" # required, title of the video card / list +description: > #required, description of the video card + Add comments to your designs in Kanvas's Designer Mode to enhance collaboration and streamline design reviews. +video_id: "bb6J--aApk8" # required, youtube video ID +videoType: youtube # required, we also support "local" for local videos, but it's currenlty disabled. + +# categories and tags are used to match videos with documentation pages, by scoring the relevance of the video to the documentation page. +categories: [Designer] +tags: [review, collaboration, comments] # also available as hyperlinked tags in the video card as well as on individual video page +duration: 2:30 # optional, duration of the video in minutes:seconds format, "min" is automatically added to the end of the duration +--- + +{{< youtube video_id >}} # example: {{< youtube bb6J--aApk8 >}} + +``` + +this video will now appear under Getting Started category in Onboarding subcategory in /videos gallary and on docs/getting-started index page as well. + +#### Adding a video directly under a category + +- follow the 2nd step from above + +These vidoes will automatically be assigned a category of "All" inside the category tab and will be visible in the /videos gallary as well as on docs/getting-started index page. + + +see the template category folder inside content/en/videos for a working example. \ No newline at end of file From 86ec9171bc23027a4b1f8541350d8c5871763c7e Mon Sep 17 00:00:00 2001 From: vishalvivekm <110674407+vishalvivekm@users.noreply.github.com> Date: Tue, 6 May 2025 19:34:04 +0530 Subject: [PATCH 04/17] add fallback for video card img in docs view Signed-off-by: vishalvivekm <110674407+vishalvivekm@users.noreply.github.com> --- layouts/partials/video-section-index.html | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/layouts/partials/video-section-index.html b/layouts/partials/video-section-index.html index 80335bbd..a4106179 100644 --- a/layouts/partials/video-section-index.html +++ b/layouts/partials/video-section-index.html @@ -60,7 +60,11 @@ > {{ else if eq .Params.videoType "youtube" }}
+ {{ if .Params.video_id }} {{ .Title }} + {{ else }} + {{ .Title }} + {{ end }} \ No newline at end of file diff --git a/layouts/partials/video-section-index.html b/layouts/partials/video-section-index.html index 46f462e3..4cce47bd 100644 --- a/layouts/partials/video-section-index.html +++ b/layouts/partials/video-section-index.html @@ -60,8 +60,8 @@ > {{ else if eq .Params.videoType "youtube" }}
- {{ if .Params.video_id }} - {{ .Title }} + {{ if .Params.videoId }} + {{ .Title }} {{ else }} {{ .Title }} {{ end }} From 983e832f0bf58679856dd37a5c5a0a062d5217e5 Mon Sep 17 00:00:00 2001 From: vishalvivekm <110674407+vishalvivekm@users.noreply.github.com> Date: Wed, 7 May 2025 03:58:59 +0530 Subject: [PATCH 15/17] fix formatting and examples Signed-off-by: vishalvivekm <110674407+vishalvivekm@users.noreply.github.com> --- .../contributing-videos/contributing-videos.md | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) diff --git a/content/en/contributing/contributing-videos/contributing-videos.md b/content/en/contributing/contributing-videos/contributing-videos.md index 32ea318f..2b93d32d 100644 --- a/content/en/contributing/contributing-videos/contributing-videos.md +++ b/content/en/contributing/contributing-videos/contributing-videos.md @@ -4,8 +4,7 @@ weight: 1 description: A detailed contribution guide for adding videos to Layer5 Docs docs videos gallary --- -> [!Note] -> In Hugo, a section is a directory containing an `_index.md` file. +{{< alert title="Note" >}}In Hugo, a section is a directory containing an `_index.md` file.{{< /alert >}} ## Overview @@ -64,8 +63,10 @@ tags: [review, collaboration, comments] # Available as hyperlinked tags in the v duration: 2:30 # Optional: duration in minutes:seconds format ("min" is automatically added) --- -{{< youtube id="videoId" class="yt-embed-container" >}} # Example: {{< youtube id=bb6J--aApk8 class="yt-embed-container" >}} we can control the styling of this iframe and wrapping div -# by modify style of .yt-embed-container in assets/scss/_videos_project.scss +# the following youtube shortcode is used for individual video page +# Example: {{}} +# we can control the styling of resulting iframe and wrapping div by modify style of .yt-embed-container in assets/scss/_videos_project.scss +{{}} ``` ### Approach B: Add Videos Directly Under a Category @@ -118,3 +119,5 @@ content/en/videos/ ├── _index.md # Defines the "Sub Category" sub-section └── video-1.md # file containing video specific data ``` + +See `content/en/videos/template-category/` for an example of a category with subcategories and videos. It is set to draft and is not published and is intended as a reference for adding videos. \ No newline at end of file From dc40b6a953b7d9f99d32513ac8dad5cdb24a1efc Mon Sep 17 00:00:00 2001 From: vishalvivekm <110674407+vishalvivekm@users.noreply.github.com> Date: Wed, 7 May 2025 04:24:33 +0530 Subject: [PATCH 16/17] add videoId to template video Signed-off-by: vishalvivekm <110674407+vishalvivekm@users.noreply.github.com> --- content/en/videos/template-category/sub-category/video-1.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/en/videos/template-category/sub-category/video-1.md b/content/en/videos/template-category/sub-category/video-1.md index 16813b5b..bb14183d 100644 --- a/content/en/videos/template-category/sub-category/video-1.md +++ b/content/en/videos/template-category/sub-category/video-1.md @@ -2,7 +2,7 @@ title: "Design Reviews: Adding Comments 1" # required, title of the video card / list description: > #required, description of the video card Add comments to your designs in Kanvas's Designer Mode to enhance collaboration and streamline design reviews. -videoId: "" # required, youtube video ID, example: bb6J--aApk8 +videoId: "bb6J--aApk8" # required, youtube video ID, example: bb6J--aApk8 videoType: youtube # required, we also support "local" for local videos, but it's currenlty disabled. # categories and tags are used to match videos with documentation pages, by scoring the relevance of the video to the documentation page. From 36d11c5880eb52d596753da82da93f13ef876552 Mon Sep 17 00:00:00 2001 From: vishalvivekm <110674407+vishalvivekm@users.noreply.github.com> Date: Thu, 8 May 2025 00:49:13 +0530 Subject: [PATCH 17/17] Single section for contributing Signed-off-by: vishalvivekm <110674407+vishalvivekm@users.noreply.github.com> --- content/en/contributing/_index.md | 2 +- .../{contributing-to-site => }/contributing-to-docs.md | 0 content/en/contributing/contributing-to-site/_index.md | 6 ------ ...tributing-videos.md => contributing-to-video-gallary.md} | 6 +++--- content/en/contributing/contributing-videos/_index.md | 6 ------ 5 files changed, 4 insertions(+), 16 deletions(-) rename content/en/contributing/{contributing-to-site => }/contributing-to-docs.md (100%) delete mode 100644 content/en/contributing/contributing-to-site/_index.md rename content/en/contributing/{contributing-videos/contributing-videos.md => contributing-to-video-gallary.md} (95%) delete mode 100644 content/en/contributing/contributing-videos/_index.md diff --git a/content/en/contributing/_index.md b/content/en/contributing/_index.md index c60ce891..d8ce5b45 100644 --- a/content/en/contributing/_index.md +++ b/content/en/contributing/_index.md @@ -1,6 +1,6 @@ --- title: Contributing -description: Contributing guides to docs and videos +description: Contributing guides on documentation and video gallery type: docs cascade: type: docs diff --git a/content/en/contributing/contributing-to-site/contributing-to-docs.md b/content/en/contributing/contributing-to-docs.md similarity index 100% rename from content/en/contributing/contributing-to-site/contributing-to-docs.md rename to content/en/contributing/contributing-to-docs.md diff --git a/content/en/contributing/contributing-to-site/_index.md b/content/en/contributing/contributing-to-site/_index.md deleted file mode 100644 index 02e2ffc8..00000000 --- a/content/en/contributing/contributing-to-site/_index.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -title: Contributing to Docs -weight: 1 -description: > - Contributing Guide to Layer5 docs, a hugo site using google docsy theme. ---- \ No newline at end of file diff --git a/content/en/contributing/contributing-videos/contributing-videos.md b/content/en/contributing/contributing-to-video-gallary.md similarity index 95% rename from content/en/contributing/contributing-videos/contributing-videos.md rename to content/en/contributing/contributing-to-video-gallary.md index 2b93d32d..f3a9ef76 100644 --- a/content/en/contributing/contributing-videos/contributing-videos.md +++ b/content/en/contributing/contributing-to-video-gallary.md @@ -1,7 +1,7 @@ --- -title: Contributing Videos to Layer5 docs +title: Contributing to Video Gallery weight: 1 -description: A detailed contribution guide for adding videos to Layer5 Docs docs videos gallary +description: A detailed contribution guide for adding videos to Layer5 Docs video gallary --- {{< alert title="Note" >}}In Hugo, a section is a directory containing an `_index.md` file.{{< /alert >}} @@ -28,7 +28,7 @@ icon: bi-rocket-takeoff-fill # Icon for the category (supports Bootstrap icons a videoGrid: true # When true, shows all child / nested videos as a grid of cards on this section's index page # When false, presents a hyperlinked list of videos/sub-sections instead -draft: true # When true, previews on local dev server but hides from left sidebar and /videos landing page on published site +draft: true # When true, previews this section on local dev server but hides from left sidebar and /videos landing page on published site ``` ## 2. Adding Videos to Your Category diff --git a/content/en/contributing/contributing-videos/_index.md b/content/en/contributing/contributing-videos/_index.md deleted file mode 100644 index 30be0001..00000000 --- a/content/en/contributing/contributing-videos/_index.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -title: Contributing Videos -weight: 2 -description: > - Contributing guide on adding videos to the site ---- \ No newline at end of file