Skip to content

Commit

Permalink
Rebrand Ubuntu Raspberry Pi
Browse files Browse the repository at this point in the history
  • Loading branch information
Carlos Wu Fei authored and Carlos Wu Fei committed Apr 4, 2024
1 parent ae74303 commit c73406e
Show file tree
Hide file tree
Showing 5 changed files with 148 additions and 208 deletions.
4 changes: 3 additions & 1 deletion templates/download/desktop/thank-you.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,9 @@ <h1>Thank you for your contribution</h1>
{% endif %}
</div>
<div class="col">
{% include 'shared/_server-download-newsletter.html' %}
{% with returnUrl="/download/desktop" %}
{% include 'shared/_download-newsletter.html' %}
{% endwith %}
</div>
</div>
</section>
Expand Down
278 changes: 107 additions & 171 deletions templates/download/raspberry-pi/thank-you.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,212 +8,148 @@

{% block meta_copydoc %}https://docs.google.com/document/d/1RXsLbMB-LJVwiG0gAi0HgVEJvZ9_GIU3ESLJ6KmBb54{% endblock meta_copydoc %}

{% block head_extra%}<meta name="robots" content="noindex" />{% endblock %}
{% block head_extra %}<meta name="robots" content="noindex" />{% endblock %}

{% block body_class %}is-paper{% endblock %}

{% block content %}

{% if version %}
<meta http-equiv="refresh" content="3;url={% if version==releases.latest.core_version %}https://cdimage.ubuntu.com/ubuntu-core/{{ version }}/stable/current/ubuntu-{{ architecture }}.img.xz{% else %}https://cdimage.ubuntu.com/releases/{{ version }}/release/ubuntu-{{ version }}-preinstalled-{{ architecture }}.img.xz{% endif %}">


{% endif %}

<section class="p-strip--suru-topped" style="overflow: visible;">
<div class="row u-vertically-center">
<div class="col-7">
<section class="p-strip is-shallow u-no-padding--bottom">
<div class="row--50-50">
<div class="col">
{% if version %}
<h1>Thank you for downloading<br />
<h1>Thank you for downloading<br class="u-hide--small" />
Ubuntu {% if version==releases.latest.core_version %}Core {% endif %}{{ version }}<br />
for Raspberry Pi</h1>
<p>Your download should start automatically. If it doesn't, <a href="{% if version==releases.latest.core_version %}https://cdimage.ubuntu.com/ubuntu-core/{{ version }}/stable/current/ubuntu-{{ architecture }}.img.xz{% else %}https://cdimage.ubuntu.com/releases/{{ version }}/release/ubuntu-{{ version }}-preinstalled-{{ architecture }}.img.xz{% endif %}">download now</a>.</p>
<p>Your download should start automatically. If it doesn't,
<a href="{% if version==releases.latest.core_version %}https://cdimage.ubuntu.com/ubuntu-core/{{ version }}/stable/current/ubuntu-{{ architecture }}.img.xz{% else %}https://cdimage.ubuntu.com/releases/{{ version }}/release/ubuntu-{{ version }}-preinstalled-{{ architecture }}.img.xz{% endif %}">download now</a>.<br />
{% with version=version, system=architecture, architecture=architecture %}
{% include "download/shared/_verify-checksums.html" %}
{% include "download/shared/_verify-checksums.html" %}
{% endwith %}
{% else %}
</p>
{% else %}
<h1>Thank you</h1>
<h4>However, you have not selected an image to download.</h4>
<p>Go to the <a href="/download/raspberry-pi">download page</a> to select an image.</p>
{% endif %}
</div>
<div class="col-5 u-hide--medium u-hide--small u-align--center">
{{
image(
url="https://assets.ubuntu.com/v1/9f09965f-1+-+Download+and+install+Ubuntu+Server+on+Raspberry+Pi.svg",
alt="",
height="227",
width="350",
hi_def=True,
loading="auto"
) | safe
}}
</div>
<p>However, you have not selected an image to download.<br />Go to the <a href="/download/raspberry-pi">download page</a> to select an image.</p>
{% endif %}
</div>
</section>
<div class="col">
{% with returnUrl="/download/raspberry-pi" %}
{% include 'shared/_download-newsletter.html' %}
{% endwith %}
</div>
</div>
</section>

<section class="p-strip--light">
<div class="row">
<div class="col-8">
<h2>Installation instructions</h2>
<p>The simplest way to install Ubuntu is to use the <a href="https://www.raspberrypi.com/software/">Raspberry Pi Imager</a> which enables you to select an Ubuntu image during installation. Follow our tutorials below to learn how.</p>
</div>
<section class="p-section">
<hr class="p-rule is-fixed-width" />
<div class="row--50-50 p-section--shallow">
<div class="col">
<h2>Installation instructions</h2>
</div>
<div class="col">
<p>The simplest way to install Ubuntu is to use the <a href="https://www.raspberrypi.com/software/">Raspberry Pi Imager</a> which enables you to select an Ubuntu image during installation. Follow our tutorials below to learn how.</p>
</div>
<div class="row p-divider">
{% if version == releases.latest.core_version %}
<div class="col-4 blog-p-card--post">
<header class="blog-p-card__header--tutorial">
<p class="p-muted-heading u-no-margin--bottom">
core, UC20
</p>
</header>
<div class="blog-p-card__content">
<h3 class="p-heading--3 u-no-margin--top u-no-margin--bottom">
<a class="p-link--soft" href="/core/docs/uc20/install-raspberry-pi">Installing Ubuntu Core 20 on a Raspberry Pi</a>
</div>
<div class="row">
<div class="col-12 col-medium-6 col-start-large-4">
<hr class="p-rule is-fixed-width" />
<div class="row">
{% if version == releases.latest.core_version %}
<div class="col-4 col-medium-2">
<h3 class="p-heading--5">
<a href="/core/docs/uc20/install-raspberry-pi">Installing Ubuntu Core 20 on a Raspberry Pi</a>
</h3>
<p class="u-sv3">A complete guide to installing Ubuntu Core on a Raspberry Pi 4 (4GB or 8GB).</p>
<p>A complete guide to installing Ubuntu Core on a Raspberry Pi 4 (4GB or 8GB).</p>
</div>
<footer class="blog-p-card__footer">
Difficulty: <span class="l-tutorials-meter l-tutorials-meter--2">2 out of 5</span>
</footer>
</div>
{% else %}
<div class="col-4 blog-p-card--post">
<header class="blog-p-card__header--tutorial">
<p class="p-muted-heading u-no-margin--bottom">
iot, desktop
</p>
</header>
<div class="blog-p-card__content">
<h3 class="p-heading--3 u-no-margin--top u-no-margin--bottom">
<a class="p-link--soft" href="/tutorials/how-to-install-ubuntu-desktop-on-raspberry-pi-4">How to install Ubuntu Desktop on Raspberry Pi 4</a>
{% else %}
<div class="col-4 col-medium-2">
<h3 class="p-heading--5">
<a href="/tutorials/how-to-install-ubuntu-desktop-on-raspberry-pi-4">How to install Ubuntu Desktop on Raspberry Pi 4</a>
</h3>
<p class="u-sv3">A complete guide to installing Ubuntu Desktop on a Raspberry Pi 4 (2GB or above).</p>
<p>A complete guide to installing Ubuntu Desktop on a Raspberry Pi 4 (2GB or above).</p>
</div>
<footer class="blog-p-card__footer">
Difficulty: <span class="l-tutorials-meter l-tutorials-meter--1">1 out of 5</span>
</footer>
</div>
{% endif %}
<div class="col-4 blog-p-card--post p-divider__block">
<header class="blog-p-card__header--tutorial">
<h5 class="p-muted-heading u-no-margin--bottom">
iot, server
</h5>
</header>
<div class="blog-p-card__content">
<h3 class="p-heading--3 u-no-margin--top u-no-margin--bottom">
<a class="p-link--soft" href="/tutorials/how-to-install-ubuntu-on-your-raspberry-pi">How to install Ubuntu Server on your Raspberry Pi</a>
{% endif %}
<div class="col-4 col-medium-2">
<h3 class="p-heading--5">
<a href="/tutorials/how-to-install-ubuntu-on-your-raspberry-pi">How to install Ubuntu Server on your Raspberry Pi</a>
</h3>
<p class="u-sv3">A complete guide to installing Ubuntu Server on your Raspberry Pi 4, 3 or 2 in a couple minutes. In a headless setup or with a screen and with a Wi-Fi or ethernet connection.</p>
<p>A complete guide to installing Ubuntu Server on your Raspberry Pi 4, 3 or 2 in a couple minutes. In a headless setup or with a screen and with a Wi-Fi or ethernet connection.</p>
</div>
<footer class="blog-p-card__footer">
Difficulty: <span class="l-tutorials-meter l-tutorials-meter--2">2 out of 5</span>
</footer>
</div>
<div class="col-4 blog-p-card--post p-divider__block">
<header class="blog-p-card__header--tutorial">
<h5 class="p-muted-heading u-no-margin--bottom">
iot, core
</h5>
</header>
<div class="blog-p-card__content">
<h3 class="p-heading--3 u-no-margin--top u-no-margin--bottom">
<a class="p-link--soft" href="/download/raspberry-pi-core">Install Ubuntu Core on a Raspberry Pi</a>
<div class="col-4 col-medium-2">
<h3 class="p-heading--5">
<a href="/download/raspberry-pi-core">Install Ubuntu Core on a Raspberry Pi</a>
</h3>
<p class="u-sv3">Walk through the steps of flashing Ubuntu Core on a Raspberry Pi 2, 3, 4 or CM4. At the end of this process, you will have a board ready for production or testing snaps.</p>
<p>Walk through the steps of flashing Ubuntu Core on a Raspberry Pi 4, 3, 2 or CM4. At the end of this process, you will have a board ready for production or testing snaps.</p>
</div>
<footer class="blog-p-card__footer">
Difficulty: <span class="l-tutorials-meter l-tutorials-meter--3">3 out of 5</span>
</footer>
</div>
</div>
</section>

<section class="p-strip">
<div class="u-fixed-width">
<h2>Make something great today</h2>
<p>Check out these project ideas to help you get started.</p>
</div>
<div class="row p-divider">
<div class="col-3 p-divider__block">
<div class="p-heading-icon--muted">
<div class="p-heading-icon__header">
{{ image (
url="https://assets.ubuntu.com/v1/e2315503-tutorial.svg",
alt="",
width="231",
height="150",
hi_def=True,
loading="lazy",
attrs={"class": "p-heading-icon__img p-heading-icon__img--small"}
) | safe
}}
<h4 class="p-heading-icon__title">Tutorial</h4>
</div>
<h3 class="p-heading--4"><a href="/blog/linux-gaming-tutorial-raspberry-pi-minecraft-server-on-ubuntu-desktop">Raspberry Pi Tutorial: Host a Minecraft
server on Ubuntu Desktop</a></h3>
</div>
</section>

<section class="p-section">
<hr class="p-rule is-fixed-width" />
<div class="row">
<div class="col-6">
<h2>Make something great today</h2>
</div>
<div class="col-3 p-divider__block">
<div class="p-heading-icon--muted">
<div class="p-heading-icon__header">
{{ image (
url="https://assets.ubuntu.com/v1/e2315503-tutorial.svg",
alt="",
width="231",
height="150",
hi_def=True,
loading="lazy",
attrs={"class": "p-heading-icon__img p-heading-icon__img--small"}
) | safe
}}
<h4 class="p-heading-icon__title">Tutorial</h4>
</div>
<h3 class="p-heading--4"><a href="/blog/common-sense-using-the-raspberry-pi-sense-hat-on-ubuntu-impish-indri">Common Sense &mdash; using the Raspberry
Pi Sense HAT on Ubuntu Impish Indri</a></h3>
</div>
<div class="col-6">
<ul class="p-list--divided">
<li class="p-list__item">
<a href="/blog/linux-gaming-tutorial-raspberry-pi-minecraft-server-on-ubuntu-desktop">Raspberry Pi Tutorial: Host a Minecraft server on Ubuntu Desktop</a>
</li>
<li class="p-list__item">
<a href="/blog/common-sense-using-the-raspberry-pi-sense-hat-on-ubuntu-impish-indri">Common Sense &mdash; using the Raspberry Pi Sense HAT on Ubuntu Impish Indri</a>
</li>
<li class="p-list__item">
<a href="/blog/homelab-clusters-lxd-micro-cloud-on-raspberry-pi">Homelab clusters: LXD micro cloud on Raspberry Pi</a>
</li>
<li class="p-list__item">
<a href="https://maas.io/tutorials/build-your-own-bare-metal-cloud-using-a-raspberry-pi-cluster-with-maas#1-overview">Build your own bare metal cloud using a Raspberry Pi cluster with MAAS</a>
</li>
</ul>
</div>
<div class="col-3 p-divider__block">
<div class="p-heading-icon--muted">
<div class="p-heading-icon__header">
{{ image (
url="https://assets.ubuntu.com/v1/e2315503-tutorial.svg",
alt="",
width="231",
height="150",
hi_def=True,
loading="lazy",
attrs={"class": "p-heading-icon__img p-heading-icon__img--small"}
) | safe
}}
<h4 class="p-heading-icon__title">Tutorial</h4>
</div>
<h3 class="p-heading--4"><a href="/blog/homelab-clusters-lxd-micro-cloud-on-raspberry-pi">Homelab clusters: LXD micro cloud on Raspberry Pi</a></h3>
</div>
</section>

<section class="p-section--deep">
<div class="row">
<hr class="p-rule"/>
<div class="col-3 col-medium-6">
<div class="p-section--shallow">
<h2 class="p-text--small-caps"><a href="/blog/tag/raspberry-pi">Latest from&nbsp;our&nbsp;blog&nbsp;&rsaquo;</a></h2>
</div>
</div>
<div class="col-3 p-divider__block">
<div class="p-heading-icon--muted">
<div class="p-heading-icon__header">
{{ image (
url="https://assets.ubuntu.com/v1/e2315503-tutorial.svg",
alt="",
width="231",
height="150",
hi_def=True,
loading="lazy",
attrs={"class": "p-heading-icon__img p-heading-icon__img--small"}
) | safe
}}
<h4 class="p-heading-icon__title">Tutorial</h4>
</div>
<h3 class="p-heading--4"><a href="https://maas.io/tutorials/build-your-own-bare-metal-cloud-using-a-raspberry-pi-cluster-with-maas#1-overview">Build
your own bare metal cloud using a Raspberry Pi cluster with MAAS</a></h3>
<div class="col-9 col-medium-6">
<div class="row p-section--shallow" id="blog-latest">
</div>
</div>
</div>

<template style="display:none" id="blog-template">
<div class="col-3 col-medium-2">
<div class="article-image u-blog-thumbnails p-image-wrapper"></div>
<h3 class="p-heading--5"><a class="article-link article-title"></a></h3>
<p class="article-excerpt"></p>
</div>
</template>
</section>

{% with section_classes='p-strip--light is-bordered', heading_topic='Raspberry Pi', tag_name='raspberry-pi', tag_id='1672', limit='4' %}
{% include "shared/_latest_news_strip.html" %}
{% endwith %}
<script src="{{ versioned_static('js/dist/latest-news.js') }}"></script>
<script>
canonicalLatestNews.fetchLatestNews(
{
articlesContainerSelector: "#blog-latest",
articleTemplateSelector: "#blog-template",
excerptLength: 200,
tagId: 1672,
limit: 3,
linkImage: true,
}
)
</script>

{% endblock %}
4 changes: 3 additions & 1 deletion templates/download/server/thank-you.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,9 @@ <h1 class="js-download-option">Thank you for downloading Ubuntu Server {{ versio
</p>
</div>
<div class="col">
{% include 'shared/_server-download-newsletter.html' %}
{% with returnUrl="/download/server" %}
{% include 'shared/_download-newsletter.html' %}
{% endwith %}
</div>
</div>
</section>
Expand Down
35 changes: 35 additions & 0 deletions templates/shared/_download-newsletter.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
<div>
<h2>Sign up for our newsletter</h2>
<p>Get the latest Ubuntu news and updates in your inbox.</p>
</div>

<form action="/marketo/submit" method="post" id="mktoForm_4960" onsubmit="ga('send', 'Newsletter', 'Signup', 'Ubuntu Server download newsletter signup');">
<label for="email">Email*:</label>
<input required id="email" name="email" maxlength="255" type="email" pattern="^[^ ]+@[^ ]+\.[a-z]{2,26}$" />

<div class="p-section--shallow">
<label class="p-checkbox">
<input required class="p-checkbox__input" value="yes" aria-labelledby="canonicalUpdatesOptIn" name="canonicalUpdatesOptIn" type="checkbox">
<span class="p-checkbox__label" id="canonicalUpdatesOptIn">I agree to receive information about Canonical's products and services.</span>
</label>
<p>By submitting this form, I confirm that I have read and agree to <a href="/legal/data-privacy/contact">Canonical's Privacy Notice</a> and <a href="/legal/data-privacy">Privacy Policy</a>.</p>
<hr />
<button type="submit" class="p-button--positive">Subscribe now</button>
</div>

<div class="p-section--shallow">
<input value="4960" name="formid" type="hidden">
<input type="hidden" name="Consent_to_Processing__c" value="yes" />
<input type="hidden" aria-hidden="true" aria-label="hidden field" name="returnURL" value="{{ returnUrl }}#newsletter-signup" />
<input type="hidden" aria-hidden="true" aria-label="hidden field" name="utm_campaign" id="utm_campaign"
value="" />
<input type="hidden" aria-hidden="true" aria-label="hidden field" name="utm_medium" id="utm_medium" value="" />
<input type="hidden" aria-hidden="true" aria-label="hidden field" name="utm_source" id="utm_source" value="" />
<input type="hidden" aria-hidden="true" aria-label="hidden field" name="utm_content" id="utm_content" value="" />
<input type="hidden" aria-hidden="true" aria-label="hidden field" name="utm_term" id="utm_term" value="" />
<input type="hidden" aria-hidden="true" aria-label="hidden field" id="preferredLanguage" name="preferredLanguage"
maxlength="255" value="" />
<input type="hidden" name="thankyoumessage"
value="Thank you for signing up for our newsletter!<br/>In these regular emails you will find the latest updates from Ubuntu and upcoming events where you can meet our team.">
</div>
</form>
Loading

0 comments on commit c73406e

Please sign in to comment.