From 6e8a9904715035c34e467548422fec3db5d342e5 Mon Sep 17 00:00:00 2001 From: Keri Melich <12851439+themightymuppet@users.noreply.github.com> Date: Fri, 21 Feb 2025 19:47:13 -0700 Subject: [PATCH] [global] add social badges to shortcodes (#14902) --- .../layouts/partials/events/cta.html | 36 ++++---- .../layouts/shortcodes/event_social_bsky.html | 7 ++ .../shortcodes/event_social_linkedin.html | 7 ++ .../shortcodes/event_social_listserv.html | 7 ++ .../shortcodes/event_social_mastodon.html | 7 ++ .../shortcodes/event_social_slack.html | 7 ++ .../shortcodes/event_social_twitter.html | 7 ++ .../shortcodes/event_social_youtube.html | 7 ++ themes/devopsdays-theme/reference.md | 35 +++++--- themes/devopsdays-theme/static/css/site.css | 86 +++++++++++++++++++ utilities/examples/data/events/main.yml | 12 +++ 11 files changed, 186 insertions(+), 32 deletions(-) create mode 100644 themes/devopsdays-theme/layouts/shortcodes/event_social_bsky.html create mode 100644 themes/devopsdays-theme/layouts/shortcodes/event_social_linkedin.html create mode 100644 themes/devopsdays-theme/layouts/shortcodes/event_social_listserv.html create mode 100644 themes/devopsdays-theme/layouts/shortcodes/event_social_mastodon.html create mode 100644 themes/devopsdays-theme/layouts/shortcodes/event_social_slack.html create mode 100644 themes/devopsdays-theme/layouts/shortcodes/event_social_twitter.html create mode 100644 themes/devopsdays-theme/layouts/shortcodes/event_social_youtube.html diff --git a/themes/devopsdays-theme/layouts/partials/events/cta.html b/themes/devopsdays-theme/layouts/partials/events/cta.html index e5865ea9cd2..01cf09fa8ca 100644 --- a/themes/devopsdays-theme/layouts/partials/events/cta.html +++ b/themes/devopsdays-theme/layouts/partials/events/cta.html @@ -2,6 +2,17 @@
+ + {{- if $e.startdate -}} + {{- if $e.cfp_date_start -}} + {{- if and (ge now (time $e.cfp_date_start)) (le now (time $e.cfp_date_end)) -}} +
+ Propose +
+ {{- end -}} + {{- end -}} + {{- end -}} + {{- if $e.registration_open -}} {{- if eq $e.registration_open "true" -}} @@ -46,26 +57,11 @@ {{- end -}} {{- end -}} - - - - {{- if $e.startdate -}} - {{- if $e.cfp_date_start -}} - {{- if and (ge now (time $e.cfp_date_start)) (le now (time $e.cfp_date_end)) -}} -
- Propose -
- {{- end -}} - {{- end -}} - {{- end -}} - - - - - {{- if $e.event_twitter -}} - {{- if ne $e.event.twitter "" -}} + + {{- if $e.organizer_email -}} + {{- if ne $e.organizer_email "" -}}
- Follow + Contact
{{- end -}} {{- end -}} @@ -120,4 +116,4 @@
- + \ No newline at end of file diff --git a/themes/devopsdays-theme/layouts/shortcodes/event_social_bsky.html b/themes/devopsdays-theme/layouts/shortcodes/event_social_bsky.html new file mode 100644 index 00000000000..daf6d67865c --- /dev/null +++ b/themes/devopsdays-theme/layouts/shortcodes/event_social_bsky.html @@ -0,0 +1,7 @@ +{{- $e := partial "functions/get-event-data" . -}} + +{{- if $e.event_social_bsky -}} + +{{- else -}} + +{{- end -}} \ No newline at end of file diff --git a/themes/devopsdays-theme/layouts/shortcodes/event_social_linkedin.html b/themes/devopsdays-theme/layouts/shortcodes/event_social_linkedin.html new file mode 100644 index 00000000000..2e0ffeb7a9a --- /dev/null +++ b/themes/devopsdays-theme/layouts/shortcodes/event_social_linkedin.html @@ -0,0 +1,7 @@ +{{- $e := partial "functions/get-event-data" . -}} + +{{- if $e.event_social_linkedin -}} + +{{- else -}} + +{{- end -}} \ No newline at end of file diff --git a/themes/devopsdays-theme/layouts/shortcodes/event_social_listserv.html b/themes/devopsdays-theme/layouts/shortcodes/event_social_listserv.html new file mode 100644 index 00000000000..3dc449b9652 --- /dev/null +++ b/themes/devopsdays-theme/layouts/shortcodes/event_social_listserv.html @@ -0,0 +1,7 @@ +{{- $e := partial "functions/get-event-data" . -}} + +{{- if $e.event_social_listserv -}} + +{{- else -}} + +{{- end -}} \ No newline at end of file diff --git a/themes/devopsdays-theme/layouts/shortcodes/event_social_mastodon.html b/themes/devopsdays-theme/layouts/shortcodes/event_social_mastodon.html new file mode 100644 index 00000000000..3f7e967cbb9 --- /dev/null +++ b/themes/devopsdays-theme/layouts/shortcodes/event_social_mastodon.html @@ -0,0 +1,7 @@ +{{- $e := partial "functions/get-event-data" . -}} + +{{- if $e.event_social_mastodon -}} + +{{- else -}} + +{{- end -}} \ No newline at end of file diff --git a/themes/devopsdays-theme/layouts/shortcodes/event_social_slack.html b/themes/devopsdays-theme/layouts/shortcodes/event_social_slack.html new file mode 100644 index 00000000000..b0fb292ac22 --- /dev/null +++ b/themes/devopsdays-theme/layouts/shortcodes/event_social_slack.html @@ -0,0 +1,7 @@ +{{- $e := partial "functions/get-event-data" . -}} + +{{- if $e.event_social_slack -}} + +{{- else -}} + +{{- end -}} \ No newline at end of file diff --git a/themes/devopsdays-theme/layouts/shortcodes/event_social_twitter.html b/themes/devopsdays-theme/layouts/shortcodes/event_social_twitter.html new file mode 100644 index 00000000000..e6db0d91fbd --- /dev/null +++ b/themes/devopsdays-theme/layouts/shortcodes/event_social_twitter.html @@ -0,0 +1,7 @@ +{{- $e := partial "functions/get-event-data" . -}} + +{{- if $e.event_social_twitter -}} + +{{- else -}} + +{{- end -}} \ No newline at end of file diff --git a/themes/devopsdays-theme/layouts/shortcodes/event_social_youtube.html b/themes/devopsdays-theme/layouts/shortcodes/event_social_youtube.html new file mode 100644 index 00000000000..b98ebb75c14 --- /dev/null +++ b/themes/devopsdays-theme/layouts/shortcodes/event_social_youtube.html @@ -0,0 +1,7 @@ +{{- $e := partial "functions/get-event-data" . -}} + +{{- if $e.event_social_youtube -}} + +{{- else -}} + +{{- end -}} \ No newline at end of file diff --git a/themes/devopsdays-theme/reference.md b/themes/devopsdays-theme/reference.md index 3db2fc4f8ff..2592c40acd4 100644 --- a/themes/devopsdays-theme/reference.md +++ b/themes/devopsdays-theme/reference.md @@ -47,18 +47,17 @@ The `/data/events/YYYY/CITY.main.yml` file is the main configuration file for yo ### General Fields -| Field Name | Type | Required | Description | Example | -|------------------|--------|----------|-------------------------------------------------------------------------------------------------------|-----------------------------------------------| -| `name` | String | Yes | The name of the event. Four digit year with the city name in lower-case, with no spaces. | "2017-chicago" | -| `year` | String | Yes | The year of the event. Make sure it is in quotes. | "2017" | -| `city` | String | Yes | The displayed city name of the event. Capitalize it. | "Salt Lake City" | -| `event_twitter` | String | Yes | The twitter handle for your event such as "devopsdayschi" or "devopsdaysmsp". Exclude the "@" symbol. | "devopsdayschi" | -| `description` | String | No | Overall description of your event. Quotation marks need to be escaped. | "It's time for more DevOpsDays at Ponyville!" | -| `ga_tracking_id` | String | No | If you have your own Google Analytics tracking ID, enter it here. | "UA-74738648-1" | -| `gtm_tracking_id` | String | No | If you have your own Google Analytics v4 tracking ID, enter it here. | "G-NCBC4PBEMK" | -| `event_group` | String | No | If you'd like to group different events together (ie, "australia"), set them to the same "event_group" | "ponyville" | -| `speakers_verbose` | String | No | Set this to "true" if you want verbose speaker attributes (URLs visible). | "true" | -| `cancel` | String | No | If your event must be cancelled, add this field with the value of "true" (case-sensitive). This will keep it from being listed in the "upcoming events" views. | "true" | | +| Field Name | Type | Required | Description | Example | +|--------------------|--------|----------|-------------------------------------------------------------------------------------------------------|-----------------------------------------------| +| `name` | String | Yes | The name of the event. Four digit year with the city name in lower-case, with no spaces. | "2017-chicago" | +| `year` | String | Yes | The year of the event. Make sure it is in quotes. | "2017" | +| `city` | String | Yes | The displayed city name of the event. Capitalize it. | "Salt Lake City" | +| `description` | String | No | Overall description of your event. Quotation marks need to be escaped. | "It's time for more DevOpsDays at Ponyville!" | +| `ga_tracking_id` | String | No | If you have your own Google Analytics tracking ID, enter it here. | "UA-74738648-1" | +| `gtm_tracking_id` | String | No | If you have your own Google Analytics v4 tracking ID, enter it here. | "G-NCBC4PBEMK" | +| `event_group` | String | No | If you'd like to group different events together (ie, "australia"), set them to the same "event_group"| "ponyville" | +| `speakers_verbose` | String | No | Set this to "true" if you want verbose speaker attributes (URLs visible). | "true" | +| `cancel` | String | No | If your event must be cancelled, add this field with the value of "true" (case-sensitive). This will keep it from being listed in the "upcoming events" views. | "true" | ### Date-related Fields All dates are in unquoted YYYY-MM-DD, like this: `variable: 2016-01-05`, or like `variable: 2016-01-05T23:59:00-06:00` @@ -80,6 +79,18 @@ All dates are in unquoted YYYY-MM-DD, like this: `variable: 2016-01-05`, or like | `registration_link` | String | No | If you have a custom registration link, enter it here. This will control the Registration menu item as well as the "Register" button. | "https://myurlhere" reference it like {{< event_link url-key="registration_link" text="Register to attend the conference!" >}} | | | `sponsor_link` | String | No | If you have a custom sponsorship link, enter it here. This will control the "Become an X Sponsor!" links. It does NOT change the "Sponsor" button. | "https://myurlhere" | | +### Social Fields +| Field Name | Type | Required | Description | Example | +|-------------------------|--------|----------|-------------------------------------------------------------------------------------------------------|------------------------------------------------------| +| `event_social_twitter` | String | No | The twitter handle for your event such as "devopsdayschi" or "devopsdaysmsp". Exclude the "@" symbol. | "devopsdaysrox" | +| `event_social_linkedin` | String | No | The direct URL to your linkedin event or group/company page. | "https://www.linkedin.com/company/devopsdaysrox" | +| `event_social_youtube` | String | No | The Youtube handle for your event such as "devopsdaysrox" or "devopsdayschi". Exclude the "@" symbol. | "devopsdaysrox" | +| `event_social_bsky` | String | No | The BlueSky direct URL for your event/group profile. Can link to a custom server. | "https://bsky.app/profile/dodrox.bsky.social" | +| `event_social_mastodon` | String | No | The Mastodon direct URL for your event/group profile. Can link to a custom server. | "https://mastodon.social/@dodrox" | +| `event_social_slack` | String | No | The invite URL to your slack workspace. | "https://join.slack.com/t/dodrox/shared_invite/xyz" | +| `event_social_listserv` | String | No | The URL to subscribe to your group mailing list. | "https://lists.devopsdays.org/subscription?f=xyz". | +| `event_twitter` | String | No | Legacy field for the twitter handle. Exclude the "@" symbol. Kept for backward support. | "devopsdayschi" | + ### Branding Fields | Field Name | Type | Required | Description | Example | diff --git a/themes/devopsdays-theme/static/css/site.css b/themes/devopsdays-theme/static/css/site.css index 444a002d5d0..e9c783bff23 100644 --- a/themes/devopsdays-theme/static/css/site.css +++ b/themes/devopsdays-theme/static/css/site.css @@ -10346,4 +10346,90 @@ article .article__body nav#toc .toc li > ol { font-size: 13px; } } + +/* social badges */ +.social-bsky { + color: black; + height: 50px; + padding: 12px; + font-size: 30px; + text-decoration: none; + display: inline-block; +} +.social-bksy:hover { + color: rgb(17, 134, 243); + text-decoration: none; +} +.social-li { + color: black; + height: 50px; + padding: 12px; + font-size: 30px; + text-decoration: none; + display: inline-block; +} +.social-li:hover { + color: rgb(29, 96, 196); + text-decoration: none; +} +.social-envelope { + color: black; + height: 50px; + padding: 12px; + font-size: 30px; + text-decoration: none; + display: inline-block; +} +.social-envelope:hover { + color: rgb(46, 124, 43); + text-decoration: none; +} +.social-mstd { + color: black; + height: 50px; + padding: 12px; + font-size: 30px; + text-decoration: none; + display: inline-block; +} +.social-mstd:hover { + color: rgb(110, 99, 218); + text-decoration: none; +} +.social-slack { + color: black; + height: 50px; + padding: 12px; + font-size: 30px; + text-decoration: none; + display: inline-block; +} +.social-slack:hover { + color: rgb(223, 180, 42); + text-decoration: none; +} +.social-x { + color: black; + height: 50px; + padding: 12px; + font-size: 30px; + text-decoration: none; + display: inline-block; +} +.social-x:hover { + color: rgb(95, 92, 92); + text-decoration: none; +} +.social-yt { + color: black; + height: 50px; + padding: 12px; + font-size: 30px; + text-decoration: none; + display: inline-block; +} +.social-yt:hover { + color: rgb(224, 52, 52); + text-decoration: none; +} /*# sourceMappingURL=site.css.map */ diff --git a/utilities/examples/data/events/main.yml b/utilities/examples/data/events/main.yml index 6fccebbec60..feb6848ddb6 100644 --- a/utilities/examples/data/events/main.yml +++ b/utilities/examples/data/events/main.yml @@ -34,6 +34,18 @@ location: "yourlocation" # Defaults to city, but you can make it the venue name. # location_address: "" #Optional - use the street address of your venue. This will show up on the welcome page if set. Also used by the event_map shortcode! +# Optional - Social badges +# These can be used in the body of any page via matching shortcodes. See sample: https://devopsdays.org/events/2025-denver/welcome/ +event_social_linkedin: "https://linkedin.com/company/devopsdayscityabbr" # Change this to the url to your Linkedin group, company, or page. +event_social_slack: "https://join.slack.com/t/devopsdayscityabbr/custom_shared_invite_url" # Change this to your slack invite link. +event_social_listserv: "https://lists.devopsdays.org/subscription?custom_listserv_invite_url" # Change this to your mailing list subscription form url. +event_social_twitter: "devopsdayscityabbr" # Change this to the twitter handle for your event such as devopsdayschi or devopsdaysmsp +event_social_mastadon: "https://mastodon.social/@devopsdayscityabbr" # Change this to url to your mastadon page +event_social_bsky: "https://bsky.app/profile/devopsdayscityabbr.bsky.social" # Change this to url to your bluesky page +event_social_youtube: "devopsdayscityabbr" # Change this to the youtube channel handle for your event such as devopsdaysrox +# legacy +event_twitter: "devopsdayscityabbr" # This will create a traditional "Follow" twitter button. Change this to the twitter handle for your event such as devopsdayschi or devopsdaysmsp. + nav_elements: # List of pages you want to show up in the navigation of your page. # - name: propose # - name: location