privacyguides/privacytools.io
Archived
1
0
Fork 0
Code Issues 304 Pull Requests 47 Activity

i18n: Keying the site (1/5) - Card/cardv2, misc, navbar, and providers #1510

Merged
djoate merged 32 commits from i18n-simple into i18n-simple 2019-11-25 19:53:36 +00:00
Conversation 8 Commits 32 Files Changed 49
+13853 -1094
djoate commented 2019-11-23 22:25:40 +00:00 (Migrated from github.com)
Copy Link
Copy Source

Keying the site, part 1 - Card/cardv2, misc, navbar, Providers

Related to PR https://github.com/privacytoolsIO/privacytools.io/pull/1509

To prevent myself from constantly merging due to changes on master, Part 5 to clean up loose ends and merging master into i18n-simple will not be opened until all of the other parts have been reviewed and merged.

Since there are going to be changes to every string on the site, I'm splitting the keying process in multiple PRs. This PR aims to key

  • the contents of card and cardv2
  • miscellaneous content:
    • index.html
    • /about/
    • /sponsors/ and /donate/
    • /services/
  • the text on the navbar (though this does not handle a language selector just yet)
  • everything under providers in the navbar, i.e.
    • Avoid US & UK services
    • Cloud Storage
    • DNS
    • Email
    • Hosting
    • Pastebins
    • Search Engines
    • Social Networks
    • Social News Aggregators
    • VPN

The migration to jekyll-simple-i18n makes keying of some pages trivial with regexp replacements.

This PR also adds in two new filters to aid the keying process.

  • translate_text adds strings to the source file in the same manner as the tag. This lets us key contents of card and cardv2, which is as simple as just using {{ include.title | translate_text}} in card.html/cardv2.html. This allows us to not use capture tags for every single card. This also lets us key external links.
  • translate_page ensures proper redirection to the appropriate local page. For example, on the original site, a link going to /providers/ is just /providers/, but the same link in the es version would be changed to /es/providers.

Some comments:

  • 404 page: Not sure how to key this

Known issues

Capture tags
I've opted to still use capture tags for the extra buttons inside of _includes/sections/participate.html as I thought that it would be better not to include entire buttons in the source file (e.g., '<a class="btn btn-warning mb-1" href="https://github.com/privacytoolsIO/privacytools.io/graphs/contributors">Contributor List</a>)

New lines in strings
Refrain from putting newlines in strings, otherwise the plugin will think it's a new key. The description string in _includes/section/browser-recommendation.html

description='Firefox is fast, reliable, open-source, and respects your privacy. Don\'t forget to adjust the settings according to our
recommendations: <a href="#webrtc"><i class="fas fa-link"></i> WebRTC</a> and <a href="#about_config"><i class="fas fa-link"></i> about:config</a> and get the <a href="#addons"><i class="fas fa-link"></i> privacy add-ons</a>.'

was automatically keyed as

Firefox_is_fast_reliable_opensource_and_respects_your_privacy._Dont_forget_to_adjust_the_setting: |
  Firefox is fast, reliable, open-source, and respects your privacy. Don't forget to adjust the settings according to our
recommendations: <a href="#webrtc"><i class="fas fa-link"></i> WebRTC</a> and <a href="#about_config"><i class="fas fa-link"></i> about:config</a> and get the <a href="#addons"><i class="fas fa-link"></i> privacy add-ons</a>.

The plugin thinks "recommendations:" is another key. The fix is to remove the newline in the original string.

This string in email-alternatives caused an error in the build process (there's a line break between "trustless," and "meaning"):

description="Bitmessage is a P2P communications protocol used to send encrypted messages to another person or to many subscribers. It is decentralized and trustless,
meaning that you need not inherently trust any entities like root certificate authorities. It uses strong authentication which means that the sender of a message cannot be spoofed, and it aims to hide \"non-content\" data."

I've had to fix these two issues for it to key properly.

## Keying the site, part 1 - Card/cardv2, misc, navbar, Providers Related to PR https://github.com/privacytoolsIO/privacytools.io/pull/1509 - Part 1 (here): Card/cardv2 content, navbar text, misc, and everything under Providers in the navbar. - Part 2 (https://github.com/privacytoolsIO/privacytools.io/pull/1517): Everything under Browsers in the navbar - Part 3 (https://github.com/privacytoolsIO/privacytools.io/pull/1518): Everything under Software in the navbar - Part 4 (https://github.com/privacytoolsIO/privacytools.io/pull/1519): Everything under OS in the navbar - Part 5 (https://github.com/privacytoolsIO/privacytools.io/pull/1509): Merging `master` into `i18n-simple` to fix conflicts, and fixing loose ends To prevent myself from constantly merging due to changes on `master`, Part 5 to clean up loose ends and merging `master` into `i18n-simple` will not be opened until all of the other parts have been reviewed and merged. --- Since there are going to be changes to every string on the site, I'm splitting the keying process in multiple PRs. This PR aims to key - the contents of card and cardv2 - miscellaneous content: * index.html * /about/ * /sponsors/ and /donate/ * /services/ - the text on the navbar (though this does not handle a language selector just yet) - everything under providers in the navbar, i.e. * Avoid US & UK services * Cloud Storage * DNS * Email * Hosting * Pastebins * Search Engines * Social Networks * Social News Aggregators * VPN The migration to jekyll-simple-i18n makes keying of some pages trivial with regexp replacements. This PR also adds in two new filters to aid the keying process. - `translate_text` adds strings to the source file in the same manner as the tag. This lets us key contents of card and cardv2, which is as simple as just using `{{ include.title | translate_text}}` in card.html/cardv2.html. This allows us to not use capture tags for every single card. This also lets us key external links. - `translate_page` ensures proper redirection to the appropriate local page. For example, on the original site, a link going to `/providers/` is just `/providers/`, but the same link in the `es` version would be changed to `/es/providers`. Some comments: - 404 page: Not sure how to key this ### Known issues **Capture tags** I've opted to still use capture tags for the extra buttons inside of `_includes/sections/participate.html` as I thought that it would be better not to include entire buttons in the source file (e.g., `'<a class="btn btn-warning mb-1" href="https://github.com/privacytoolsIO/privacytools.io/graphs/contributors">Contributor List</a>`) **New lines in strings** Refrain from putting newlines in strings, otherwise the plugin will think it's a new key. The `description` string in `_includes/section/browser-recommendation.html` ```html description='Firefox is fast, reliable, open-source, and respects your privacy. Don\'t forget to adjust the settings according to our recommendations: <a href="#webrtc"><i class="fas fa-link"></i> WebRTC</a> and <a href="#about_config"><i class="fas fa-link"></i> about:config</a> and get the <a href="#addons"><i class="fas fa-link"></i> privacy add-ons</a>.' ``` was automatically keyed as ```yml Firefox_is_fast_reliable_opensource_and_respects_your_privacy._Dont_forget_to_adjust_the_setting: | Firefox is fast, reliable, open-source, and respects your privacy. Don't forget to adjust the settings according to our recommendations: <a href="#webrtc"><i class="fas fa-link"></i> WebRTC</a> and <a href="#about_config"><i class="fas fa-link"></i> about:config</a> and get the <a href="#addons"><i class="fas fa-link"></i> privacy add-ons</a>. ``` The plugin thinks "recommendations:" is another key. The fix is to remove the newline in the original string. This string in `email-alternatives` caused an error in the build process (there's a line break between "trustless," and "meaning"): ```html description="Bitmessage is a P2P communications protocol used to send encrypted messages to another person or to many subscribers. It is decentralized and trustless, meaning that you need not inherently trust any entities like root certificate authorities. It uses strong authentication which means that the sender of a message cannot be spoofed, and it aims to hide \"non-content\" data." ``` I've had to fix these two issues for it to key properly.
jonah reviewed 2019-11-23 22:25:40 +00:00
privacytoolsIO (Migrated from github.com) reviewed 2019-11-23 22:25:40 +00:00
djoate commented 2019-11-23 22:43:48 +00:00 (Migrated from github.com)
Copy Link
Copy Source

Found some other strings that are giving compile errors

Found some other strings that are giving compile errors
djoate commented 2019-11-23 22:48:26 +00:00 (Migrated from github.com)
Copy Link
Copy Source

I've built this locally and there doesn't seem to be any problems with using href inside of the source file. The source strings may look messy with all of the <a and href, but at least it lets us specify language-specific sites for any links we include in our descriptions.

Not sure if the same should be done all links though. For example, we could also key the links that these buttons point to:

buttons

This would let translators specify links to specific locales. For instance, Firefox offers multiple translations (https://www.mozilla.org/en-US/firefox/windows/, https://www.mozilla.org/es-MX/firefox/windows/, https://www.mozilla.org/it/firefox/windows/, etc.)

EDIT: This is now done in https://github.com/privacytoolsIO/privacytools.io/pull/1510/commits/3629ad6509afe4441082e35dbabb3548f50ed066

I've built this locally and there doesn't seem to be any problems with using href inside of the source file. The source strings may look messy with all of the `<a` and `href`, but at least it lets us specify language-specific sites for any links we include in our descriptions. Not sure if the same should be done all links though. For example, we could also key the links that these buttons point to: ![buttons](https://user-images.githubusercontent.com/56777051/69486512-39e38b00-0e44-11ea-8d8a-881741b25aeb.png) This would let translators specify links to specific locales. For instance, Firefox offers multiple translations (https://www.mozilla.org/en-US/firefox/windows/, https://www.mozilla.org/es-MX/firefox/windows/, https://www.mozilla.org/it/firefox/windows/, etc.) EDIT: This is now done in https://github.com/privacytoolsIO/privacytools.io/pull/1510/commits/3629ad6509afe4441082e35dbabb3548f50ed066
jonah commented 2019-11-24 20:00:56 +00:00
Copy Link
Copy Source

The 404 page is defined in Nginx on the server-side. Even if we had language-specific files, I’m not sure how the server would determine whether or not to use them. That’s not a super big priority to me.

The 404 page is defined in Nginx on the server-side. Even if we had language-specific files, I’m not sure how the server would determine whether or not to use them. That’s not a super big priority to me.
djoate commented 2019-11-24 21:06:39 +00:00 (Migrated from github.com)
Copy Link
Copy Source

This PR is now done and awaiting review.
Just to recall, this PR aims to key

  • the contents of card and cardv2
  • miscellaneous content:
    • index.html
    • /about/
    • /sponsors/ and /donate/
    • /services/
  • the text on the navbar (though this does not handle a language selector just yet)
  • everything under Providers in the navbar, i.e.
    • Avoid US & UK services
    • Cloud Storage
    • DNS
    • Email
    • Hosting
    • Pastebins
    • Search Engines
    • Social Networks
    • Social News Aggregators
    • VPN

I have not the touched breadcrumbs and the 404 page in this PR

This PR is now done and awaiting review. Just to recall, this PR aims to key - the contents of card and cardv2 - miscellaneous content: * index.html * /about/ * /sponsors/ and /donate/ * /services/ - the text on the navbar (though this does not handle a language selector just yet) - everything under Providers in the navbar, i.e. * Avoid US & UK services * Cloud Storage * DNS * Email * Hosting * Pastebins * Search Engines * Social Networks * Social News Aggregators * VPN I have not the touched breadcrumbs and the 404 page in this PR
djoate commented 2019-11-24 21:31:46 +00:00 (Migrated from github.com)
Copy Link
Copy Source

Just added support for using the right HTML page language and hreflang tags. For example, the "Spanish" version of cloud providers has this in the source:

<!DOCTYPE html>
<html lang="es">  <!-- New -->
<head>
  <meta charset="utf-8">
  <meta name="referrer" content="no-referrer">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="keywords" content="privacy, anonymity, privacy tools, surveillance, encryption">
  <meta name="description" content="Find a cloud storage provider that won't look through your files.">
  <meta name="msapplication-TileColor" content="#da532c">
  <meta name="msapplication-TileImage" content="/assets/img/favicons/mstile-144x144.png">
  <meta name="msapplication-config" content="/assets/img/favicons/browserconfig.xml">
  <meta name="theme-color" content="#ffffff">
  <link rel="canonical" href="https://www.privacytools.io/providers/cloud-storage/">
   <!-- New: hreflang tags -->
  <link rel="alternate" hreflang="en" href="https://www.privacytools.io/providers/search-engines/" /><link rel="alternate" hreflang="en" href="https://www.privacytools.io/en/providers/search-engines/" /><link rel="alternate" hreflang="es" href="https://www.privacytools.io/es/providers/search-engines/" />

  <!-- title -->
  
  <title>Cloud Storage | PrivacyTools</title>
  <meta property="og:title" content="Cloud Storage | PrivacyTools" />
  
  <meta property="og:type" content="website" />
  <meta property="og:url" content="http://localhost:4000/es/providers/cloud-storage/" />
  <meta property="og:image" content="https://www.privacytools.io/assets/img/layout/ogimage.jpg" />
  <meta property="og:description" content="Find a cloud storage provider that won't look through your files."/>
  <!-- New: Locale changes (still defaults to en_GB) -->
  <meta property="og:locale" content="es" />
  <meta property="og:site_name" content="PrivacyTools" />
  ...

Though maybe we should also key those keywords and description

Just added support for using the right HTML page language and hreflang tags. For example, the "Spanish" version of cloud providers has this in the source: ```html <!DOCTYPE html> <html lang="es"> <!-- New --> <head> <meta charset="utf-8"> <meta name="referrer" content="no-referrer"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="keywords" content="privacy, anonymity, privacy tools, surveillance, encryption"> <meta name="description" content="Find a cloud storage provider that won't look through your files."> <meta name="msapplication-TileColor" content="#da532c"> <meta name="msapplication-TileImage" content="/assets/img/favicons/mstile-144x144.png"> <meta name="msapplication-config" content="/assets/img/favicons/browserconfig.xml"> <meta name="theme-color" content="#ffffff"> <link rel="canonical" href="https://www.privacytools.io/providers/cloud-storage/"> <!-- New: hreflang tags --> <link rel="alternate" hreflang="en" href="https://www.privacytools.io/providers/search-engines/" /><link rel="alternate" hreflang="en" href="https://www.privacytools.io/en/providers/search-engines/" /><link rel="alternate" hreflang="es" href="https://www.privacytools.io/es/providers/search-engines/" /> <!-- title --> <title>Cloud Storage | PrivacyTools</title> <meta property="og:title" content="Cloud Storage | PrivacyTools" /> <meta property="og:type" content="website" /> <meta property="og:url" content="http://localhost:4000/es/providers/cloud-storage/" /> <meta property="og:image" content="https://www.privacytools.io/assets/img/layout/ogimage.jpg" /> <meta property="og:description" content="Find a cloud storage provider that won't look through your files."/> <!-- New: Locale changes (still defaults to en_GB) --> <meta property="og:locale" content="es" /> <meta property="og:site_name" content="PrivacyTools" /> ... ``` Though maybe we should also key those keywords and description
djoate commented 2019-11-25 01:06:41 +00:00 (Migrated from github.com)
Copy Link
Copy Source

@JonahAragon After this part gets merged, see if you can get this some of this stuff working with Weblate

@JonahAragon After this part gets merged, see if you can get this some of this stuff working with Weblate
This repo is archived. You cannot comment on pull requests.
Reviewers
No Reviewers
jonah
privacytoolsIO
Labels
Clear labels
:mag:🤖 Search Engines
approved
approved, waiting for a PR
 dependencies
Pull requests that update a dependency file
 duplicate
feedback wanted
high priority
I2P
The Invisible Internet Project (I2P)
 iOS
low priority
OS
Operating Systems
 Self-contained networks
Social media
stale
A label for stalebot if it gets added
 streaming
Anything related to media streaming.
 todo
Tor
Anything covering the Tor network
 WIP
active work in progress, do not merge or PR (yet)!
 wontfix
Issues or bugs that will not be fixed and/or do not have significant impact on the project.
 XMPP
Extensible Messaging and Presence Protocol
 [m]
Matrix protocol
 ₿ cryptocurrency
ℹ️ help wanted
↔️ file sharing
⚙️ web extensions
Browser Extension related issues
 ✨ enhancement
❌ software removal
💬 discussion
🤖 Android
🐛 bug
💢 conflicting
📝 correction
Correction of content on the website
 🆘 critical
📧 email
🔒 file encryption
📁 file storage
🦊 Firefox
Firefox & forks, about:config etc.
 💻 hardware
🌐 hosting
🏠 housekeeping
Anything primarily related to site cleanup.
 🔐 password managers
🧰 productivity tools
🔎 research required
🌐 Social News Aggregators
🆕 software suggestion
👥 team chat
🔒 VPN
Virtual Private Network
 🌐 website issue
*Technical* issues with the website.
 🚫 Windows
👁️ browsers
🖊️ digital notebooks
🗄️ DNS
Domain Name System
 🗨️ instant messaging (im)
🇦🇶 translations
Anything covering a translated version of the site
No labels 🇦🇶 translations
Milestone
No items
No Milestone
Assignees
Clear assignees
jonah
No Assignees
1 Participants
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: privacyguides/privacytools.io#1510