If you are wondering if there is a way to add a colour to diacritical marks, also called accent signs, then you are in the right place! Why? Because the answer is, yes, and I will show you how.
Create a CSS style like this:
|
|
Place the diacritics within the diacritics
class
|
|
Done!
Here are examples:
|
|
It is also available via CodePen. Or, you can clone a simple test page from my test-repo: Noto Diacriticals Git branch.
Link icons are great. It signals to the reader what a link is. It is external? Or perhaps a video? If the link is clicked, will it start a download or will it open the default mail program? Link icons also helps a developer or content creator to easily find links, or the lack thereof.
Link icons started with and was popularised by Wikipedia a decade ago 1. Everyone were looking for CMS plugins to add link icons to their websites and blogs. The method back then was to use a small .png
image file as the icon. But today? We are going to use Unicode emojis and only use .svg
if an appropriate emoji is not available.
In this post, we will add link icons support in Hugo through Markdown links. No shortcode needed, just plain regular [text](https://example.com "Title")
links, thanks to the power of render hooks 2.
2022-06-17:
sftp://
protocol moved to ftp categoryfindRE
where appropriate[text](./path/to/content/)
and [text.ext](./path/to/file.ext)
formats2022-05-27:
To add link icons, follow the steps below:
Create a file called render-link.html
in this directory /layouts/_default/_markup/
Copy and paste this code:
|
|
In your stylesheet file add:
|
|
Download .svg
icons: link-icons.7z
Sources (all in the Public Domain):
It is possible to hotlink from the listed sources. However, there is no information if they were setup for it.
Extract the .svg
files in /static/img/
folder.
The following Markdown links
- External links
- [https://example.com/#fragment](https://example.com/#fragment "https://example.com/#fragment")
- Chat
- [irc://](irc://example.com "irc://") | [ircs://](ircs://example.com "ircs://") | [irc6://](irc6://example.com "irc6://") | [xmpp://](xmpp://example.com "xmpp://") | [jabber://](jabber://example.com "jabber://") | [discord://](discord://example.com "discord://") | [skype://](skype://example.com "skype://")
- FTP
- [sftp://](sftp://example.com "sftp://") | [ftp://](ftp://example.com "ftp://") | [aftp://](aftp://example.com "aftp://")
- Magnet
- [magnet://](magnet://example.com "magnet://")
- Mail
- [mailto:](mailto:noreply@example.com "mailto:")
- Remote
- [telnet://](telnet://example.com "telnet://") | [ssh://](ssh://example.com "ssh://") | [git://](git://example.com "git://") | [svn://](svn://example.com "svn://") | [bzr://](bzr://example.com "bzr://")
- Tel
- [tel:](tel:123-456-7890 "tel:")
- Books
- [doi://](doi://example.com "doi://") | [.epub](https://example.com/file.epub ".epub") | [.mobi](https://example.com/file.mobi ".mobi") | [.pdf](https://example.com/file.pdf ".pdf")
- Document
- [.odt](https://example.com/file.odt ".odt") | [.sdw](https://example.com/file.sdw ".sdw") | [.sxw](https://example.com/file.sxw ".sxw") | [.uof](https://example.com/file.uof ".uof") | [.uot](https://example.com/file.uot ".uot") | [.doc](https://example.com/file.doc ".doc") | [.docx](https://example.com/file.docx ".docx")
- Text
- [.txt](https://example.com/file.txt ".txt") | [.csv](https://example.com/file.csv ".csv")
- Presentation
- [.odp](https://example.com/file.odp ".odp") | [.fodp](https://example.com/file.fodp ".fodp") | [.sdd](https://example.com/file.sdd ".sdd") | [.sdp](https://example.com/file.sdp ".sdp") | [.sxi](https://example.com/file.sxi ".sxi") | [.uop](https://example.com/file.uop ".uop") | [.ppt](https://example.com/file.ppt ".ppt") | [.pptx](https://example.com/file.pptx ".pptx")
- Spreadsheet
- [.ods](https://example.com/file.ods ".ods") | [.fods](https://example.com/file.fods ".fods") | [.sdc](https://example.com/file.sdc ".sdc") | [.sxc](https://example.com/file.sxc ".sxc") | [.uos](https://example.com/file.uos ".uos") | [.xls](https://example.com/file.xls ".xls") | [.xlsx](https://example.com/file.xlsx ".xlsx")
- Audio
- [.flac](https://example.com/file.flac ".flac") | [.aac](https://example.com/file.aac ".aac") | [.mka](https://example.com/file.mka ".mka") | [.ogg](https://example.com/file.ogg ".ogg") | [.oga](https://example.com/file.oga ".oga") | [.opus](https://example.com/file.opus ".opus") | [.mp3](https://example.com/file.mp3 ".mp3") | [.mpa](https://example.com/file.mpa ".mpa") | [.mid](https://example.com/file.mid ".mid") | [.midi](https://example.com/file.midi ".midi") | [.wav](https://example.com/file.wav ".wav") | [.wave](https://example.com/file.wave ".wave") | [.wma](https://example.com/file.wma ".wma")
- Video
- [.av1](https://example.com/file.av1 ".av1") | [.webm](https://example.com/file.webm ".webm") | [.xvid](https://example.com/file.xvid ".xvid") | [.mkv](https://example.com/file.mkv ".mkv") | [.mk3d](https://example.com/file.mk3d ".mk3d") | [.ogm](https://example.com/file.ogm ".ogm") | [.ogv](https://example.com/file.ogv ".ogv") | [.divx](https://example.com/file.divx ".divx") | [.avi](https://example.com/file.avi ".avi") | [.mp4](https://example.com/file.mp4 ".mp4") | [.mpeg4](https://example.com/file.mpeg4 ".mpeg4") | [.mpv](https://example.com/file.mpv ".mpv") | [.mpeg](https://example.com/file.mpeg ".mpeg") | [.mpg](https://example.com/file.mpg ".mpg")
- Subtitle
- [.vtt](https://example.com/file.vtt ".vtt") | [.ttml](https://example.com/file.ttml ".ttml") | [.dfxp](https://example.com/file.dfxp ".dfxp") | [.srt](https://example.com/file.srt ".srt") | [.sub](https://example.com/file.sub ".sub") | [.sbv](https://example.com/file.sbv ".sbv") | [.scc](https://example.com/file.scc ".scc") | [.mks](https://example.com/file.mks ".mks")
- Executables
- [.deb](https://example.com/file.deb ".deb") | [.apk](https://example.com/file.apk ".apk") | [.exe](https://example.com/file.exe ".exe") | [.com](https://example.com/file.com ".com") | [.msi](https://example.com/file.msi ".msi")
- Scripts
- [.bat](https://example.com/file.bat ".bat") | [.sh](https://example.com/file.sh ".sh")
- Fonts
- [.woff](https://example.com/file.woff ".woff") | [.woff2](https://example.com/file.woff2 ".woff2") | [.otf](https://example.com/file.otf ".otf") | [.ttf](https://example.com/file.ttf ".ttf") | [.ttc](https://example.com/file.ttc ".ttc")
- Compressed files
- [.7z](https://example.com/file.7z ".7z") | [.7zip](https://example.com/file.7zip ".7zip") | [.tar](https://example.com/file.tar ".tar") | [.gz](https://example.com/file.gz ".gz") | [.gzip](https://example.com/file.gzip ".gzip") | [.bz2](https://example.com/file.bz2 ".bz2") | [.bzip2](https://example.com/file.bzip2 ".bzip2") | [.zip](https://example.com/file.zip ".zip") | [.rar](https://example.com/file.rar ".rar")
- Disk images
- [.img](https://example.com/file.img ".img") | [.iso](https://example.com/file.iso ".iso") | [.dmg](https://example.com/file.dmg ".dmg") | [.mds](https://example.com/file.mds ".mds") | [.mdf](https://example.com/file.mdf ".mdf") | [.mdx](https://example.com/file.mdx ".mdx")
- Image editing
- [.xcf](https://example.com/file.xcf ".xcf") | [.psd](https://example.com/file.psd ".psd")
Will render as:
An official list of Uniform Resource Identifier (URI) Schemes can be found at the IANA official website. 3 However, not all popular URI Schemes were registered and/or submitted, for example, discord://
and bzr://
(as of IANA document dated 2022-05-13). Regardless, these popular unregistered URI Schemes were included in the above code.
I hope you find it useful!
[text](https://example.com#fragment "Title")
.]]>One of the less commonly used feature of Hugo is render hooks. In this post, we are going to use render hooks to add internal cross reference support to Markdown’s default way of creating links: [text](https://example.com#fragment "Title")
.
Internal cross references in Hugo is usually done by using the built-in shortcodes {{< ref >}}
or {{% relref %}}
but did you know since Hugo v0.62.0 1 the advisable method is to use render hooks 2?
{{< ref >}}
and {{% relref %}}
, or any variation thereof, is a thing of the past2022-06-17:
[text](./path/to/content/)
and [text.ext](./path/to/file.ext)
formats2022-05-27:
[text](./path/to/content/)
[text.ext](./path/to/file.ext)
Create a file called render-link.html
in this directory /layouts/_default/_markup/
Add the code below:
|
|
That’s it.
|
|
The [text](./path/to/content/)
format is useful when you want to create a link to another part of your website, under the same (sub)-domain but not part of the current Hugo project. This format will not generate an external link icon if the How-To add link icons in Hugo markdown links is also installed.
The [text.ext](./path/to/file.ext)
is useful for download links hosted under the same (sub)-domain, within or external relative to the current Hugo project.
|
|
|
|
|
|
Internal linking without a file extension and with a #fragment
produces a wrong link.
|
|
Also take note of the following formats.
|
|
Instead of the above, use [text](./path/to/file.ext)
like so [link-icons.7z](./techmagus/dls/link-icons.7z)
will render as: link-icons.7z
Feel free to improve the code above and share back to the community. Please provide your website and name so you will be properly credited.
Keybase offers a lot of features, there is end-to-end encrypted Chat, a free 250 GB File storage, a signed hosting, and the ability to easily sign any text, images, and the usual document files. However, there is one feature usually ignored and this feature was one of the hottest when Keybase first sent invites to testers. That is what I will guide you through today.
]]>Once again congratulations on creating a Keybase account. You have joined a growing number of people worldwide who have taken their privacy and security to the next level.
Keybase offers a lot of features, there is end-to-end encrypted Chat, a free 250 GB File storage, a signed hosting, and the ability to easily sign any text, images, and the usual document files. However, there is one feature usually ignored and this feature was one of the hottest when Keybase first sent invites to testers. That is what I will guide you through today.
A Keybase identity is a secure online representation of someone (a person) or some entity (an organisation). It lists all the verified online assets (social network accounts, domain names, microblog accounts) of the owner of the Keybase account.
By design, it is near impossible to gain an unauthorised access to any Keybase account without an active “device” (see our previous post). This generally give us the assurance that whoever is updating a particular Keybase account is the actual owner.
However, a bad element can simply create their own Keybase account to impersonate someone. This was solved in two ways by Keybase. The first is by adding third-party identities; and the second is by being followed by other verified Keybase users.
A third-party identity is an account well-known to be under the control of the Keybase account owner. This could be a Twitter account, a domain name, a Mastodon account, or any of the different services supported by Keybase.
By adding multiple third-party identities, a Keybase account’s trust factor—if we can call it that—increases. An impersonator will not be able to add the official Twitter account of their target under their fake Keybase account. They can add their own fake Twitter account or if they successfully gained unauthorised access to the official account. It becomes harder for an impersonator to establish trust to their fake Keybase account when the official one also added a well-known Mastodon account or the domain names he or she owns.
It is impossible for a fake Keybase account to acquire the same level of trust the official account have by that point. Check my Keybase account here and count how many third-party identities are listed. An impersonator will need to have access to all of those social media accounts and domain names before they can add it to their fake Keybase account. Unless they put a gun on my head, they will not be able to do it (especially since I also use two-factor authentication in those accounts).
It is quite simple, follow these steps.
See the verication tweet live.
Repeat the process for every third-party account you have which is supported by Keybase. If a third-party service is a shared account, for example domain names or corporate microblogging accounts, it is possible to have multiple Keybase accounts verified. Check the Mastodon account for the Kolverse Worldbuilding and Writing Project, there are two Keybase accounts which verified ownership of it: @VersesSpace@writing.exchange.
Let’s say your Twitter account was hacked or you no longer have access to it. It is imperative to revoke it from your Keybase account. Simple go back to your Keybase profile, click your Twitter account, and revoke it. What it means is you are officially declaring that Twitter account to be no longer yours and any posts from it did not come from you.
It is true there could be a delay to the timestamp when you disavowed your third-party identity to when it was actually compromised, however, remember that by the time we discover our account was compromised it is always after the fact. There is nothing that can be done in that regard other than to revoke it in your Keybase account so you have an official timestamp for record purposes (especially if later you are accused of the content posted by your compromised third-party identity).
When other Keybase users follows your Keybase account, they are automatically signing your profile or Keybase identity. A follower is virtually saying “I verify this account is who s/he claims to be and the third-party identities s/he added as of this date and time I also verified to be owned by this Keybase user”.
Whenever a Keybase user changed anything in their third-part identities, their followers can optionally verify those changes by visiting the account. If they do, they are signing it effectively saying “I have checked the changes in this account’s third-party identities and have confirmed it as valid”. The more Keybase users who follows and/or verify the changes, the higher the trust factor.
Getting your family & friends to follow your Keybase account and verifying changes in your third-party identities makes it very solid that your Keybase account is actually yours and those third-party identities are also actually yours and have full control. An impersonator or fake account will not be able to build this kind of trust level.
Again, what if a third-party identity was compromised? Revoke it. Your Keybase followers can then visit your profile and confirm the change. By doing so, they are signing or adding their Keybase signature into your revocation update. We can probably say they effectively stand as “witnesses” when you revoked your compromise third-party identity.
There you go. Add all those third-party identities into your Keybase account as a “verified identity” and get your family, friends, and followers to verify those changes. The higher the trust factor of your Keybase account, the stronger and more secure your digital identity becomes.
There are various software, apps, services, available which offers one, two, or maybe three features mentioned. However, there is one which is largely ignored, that is Keybase.
]]>Freedom, anonymity, privacy, & security, are the most important part of our lives, and this is especially true today as we move faster into the digital world. We need to secure our online communications to prevent anyone from listening. We need to prove the identity of the other person we are working with. We need an easy way to use encryption to keep private data from being seen by unauthorised individuals.
There are various software, apps, services, available which offers one, two, or maybe three features mentioned. However, there is one which is largely ignored, that is Keybase.
To put it simply, Keybase is a tool which makes it easier for regular users to do encryption and signing. Private stuff stays private. Accounts are secure against spoofing, phishing, and scamming.
It also helps in establishing which online accounts are officially owned by a Keybase user, effectively nullifying online attacks through impersonation.
In other words, every person who takes their freedom, anonymity, privacy, & security very seriously must have a Keybase account.
The first thing to understand is registration through a web browser is not possible by design and for security reasons. New users must download Keybase which is available in GNU/Linux, Android, iOS, and Windows: download Keybase here.
* We’re using Keybase for Android below, the process is the same regardless of platform.
Congratulations! You have successfully created a Keybase account and have taken your first step in establishing a way for others to prove your online identity beyond any reasonable doubt as well as to chat, share files, collaborate with your team, with a peace of mind everything is automatically end-to-end encrypted and signed.
Establishing a way for others to prove our online identity, chat with family & friends, and collaborate with teams, would be practically useless if we later can not login our account. In Keybase, each [re]-installation is considered a “new device” regardless if it was exactly the same device used.
A “device” in Keybase is simply an access point or a “device” where an account is logged-in.
Registering each devices creates another security layer, if a phone was stolen one can simply “Revoke” the device. If for some reason the account was not automatically logged-out, any actions made from the “Revoked” device is automatically invalid.
Let’s create a new paper key.
A Keybase paper key is technically a “device”. It’s main purpose is to give the account owner a way to confirm a “new device” if a registered literal device is not or no longer available.
Many new Keybase users skip this step, uninstalls Keybase, and later can no longer login because they are stuck in the “new device” process. Without an existing device logged-in to Keybase you can not confirm a “new device”. A paper key acts as an “existing device” to approve a “new device”. The used paper key can be optionally revoked and a new one created (a very good practice); or create a new paper key every three months (an even better practice).
There is another way to recover a Keybase account if a paper key is not available. The catch with this method is your Keybase account will be reset back to start, all confirmed online accounts, domain names, devices, teams, followers, following, will be removed; it is as if you created a new account. The reason behind this is if you no longer have access to any of your “devices” (including your paper keys if you created any), then it is assumed all of your devices were lost and/or compromised.
Welcome to Keybase! Before you start exploring Keybase, noticed how you were not asked to enter a password/passphrase? It is only used if you want to login via a web browser—which is not advisable—and if you prefer to auto-logout when you close the Keybase app (an added security; if you reinstalled Keybase it will be considered a “new device”). We will discuss this another day.
Here is a short guide on how to activate and use Baybayin-Buhid, Baybayin-Hanunoó, Baybayin-Tagalog, and Baybayin-Tagbanwa, using Google’s Gboard app.
Download the Gboard app from the Google Play Store and Apple App Store (not yet available for iOS).
Go to the Gboard settings
Go to Languages
Tap the “ADD KEYBOARD” button at the bottom of the screen
In the “Add keyboard” page, choose:
Optionally, add:
Then remove any other keyboard layouts which were automatically added.
If you can not find the keyboard layouts mentioned above, one possible reason is your Google Play Store account and/or unit is yet to receive an update push. Until then, joining the beta is the only way.
Still no Baybayin related keyboard layouts? The last option is for you to download the latest Gboard APK, which is not advisable. But if it is your cup of tea, then download here. Remember, it may not be compatible with your phone model!
Baybayin in Gboard is now available for everyone.
It was discovered that the Gboard app is automatically disabling the layouts if there are no font support in the system.
For example, manufacturers Samsung and MyPhone deleted the Noto Tagalog font in their Android 7 and Android 8 models but left Noto Buhid, Noto Hanunoó, and Noto Tagbanwa. This is the reason why Samsung and MyPhone users can not see the “Filipino (Baybayin)” Gboard layout.
The best way to test this is to open this article in your favourite mobile browser and check if you can see the following texts.
If you can not see one of those, then your mobile phone is missing the appropriate Noto font support for that script. This in turn will automatically disable Gboard support for it. It means it is time to switch to an “Android One” model.
Since I got my first ever smartphone, Samsung Galaxy Y (S5360), (and Android too) I was having some problems with calibrating phone’s compass. The compass applications I found in the Android Market instructs users to do a figure-8 wave. I did all kinds of figure-8 wave and well, nothing.
Until I found this video showing the one figure-8 method I haven’t tried - wrist movement. It is as simple as that, all I can do is laugh at myself for doing all the silly figure-8 movements I can think of.
Watch the video:
It works for all other phones with compass features like iPhone and Symbian based phones.
Why? Their current IPv6 implementation is currently in its testing phase. All IPv6 access must come from a reliable network that they have to pre-approve, this is the Google over IPv6 project.
]]>Google, the largest search engine today (and the “Microsoft” of the cyberworld), is slowly deploying IPv6 across their sites. But even if you are already connected to IPv6, you will still not get an IPv6 Google.
Why? Their current IPv6 implementation is currently in its testing phase. All IPv6 access must come from a reliable network that they have to pre-approve, this is the Google over IPv6 project.
So unless you are using a DNS with Google over IPv6 enabled, the only IPv6 Google website you will be able to use is ipv6.google.com. That’s sad! Especially if most of the sites you visit are still hosted on non-IPv6 enabled servers.
Fortunately, there are many good-hearted people and corporations in the world today offering free access to their IPv6 DNS. We have Gogo6.com’s Freenet6 DNS and Hurricane Electric’s Tunnelbroker.net DNS.
But how do we use these IPv6 DNS? Let me show you how.
Go to Synaptic (System -> Administration -> Synaptic Package Manager)
Search for “dnsmasq” and install it
Open a Terminal (Accessories -> Terminal)
Type:
|
|
Look for:
|
|
Change it to:
|
|
Look for:
|
|
Add the following after/below it:
|
|
Save and close the file
Still in the Terminal, type:
|
|
Look for:
|
|
Uncomment that line by removing the sharp (’#’) sign
Save and close the file
Still in the Terminal, type:
|
|
Before any other nameserver entries, add this:
|
|
Save and close the file
Still in the Terminal, type:
|
|
What happens is this: we are using dnsmasq to reroute all queries to google.com to HE’s IPv6 DNS which has been confirmed to be Google over IPv6 enabled. Any Google services that are not yet using IPv6 or not yet part of the project will simply use IPv4, like the YouTube entry we added (read: YouTube is the IPv6 team’s number one priority right now).
But if you are not using DHCP, then the DHCP edits you did previously will not work. Or if you are using NetworkManager to manage your connection settings, then it will only overwrite your resolv.conf file. Here’s what you should do to solve this:
Open your NetworkManager and go to your network/connection profile (example: eth0)
Open/edit it and go to the “IPv4 Settings” tab
In the “DNS servers:” field, simply add this before any other DNS entries you may have:
|
|
Click “Apply”, then close it.
This way, every time the NetworkManager connects and overwrites the resolv.conf file, it will always add 127.0.0.1 to the file. Just like in the DHCP edits you did above, it ensures that the listening IP being used by dnsmasq is the first DNS your system will check when you are browsing.
In your terminal type:
|
|
You should see something like this:
|
|
These are the Google sites and services tested to be accessible via IPv6 (as of this article):
Not yet accessible via IPv6:
As far as I know, it is not possible to host a “sub-folder” in another server, thus we can safely assume that all Google sites with this URL format: www.google.com/{sitename} are IPv6 enabled. However, Google sites and services that are using a subdomain.google.com URL or any other, can either be IPv6 already or not. Subdomains can easily be pointed to a totally different server somewhere in cyberspace.
For those who are still using Windows XP, you are out-of-luck. Even if you can add an IPv6 DNS, it will not work, I tried it myself and it was confirmed by Mikael Lind here.
Update for Windows XP users: I found a way to do it and I will be posting it here soon! The life of your too old OS just got a little bit longer.
For Windows 7 users, you will have to wait until I can get a Win7 OS or a machine that I can break. Or better ask the experts in IPv6 like the guys and gals of the gogo6 Community.
Update 2010-02-25: Sorry WinXP users you really have to upgrade to Windows 7. The method works but it is not consistent - sometimes it works, sometimes not. It is also very different per machine (it is weird!) even if you have everything duplicated perfectly.
It will only invite frustration and plenty of questions. Again, I recommend upgrading to Windows 7 if you want a consistent and stable IPv6 capability.
Update 2010-09-20: Google Sites, Google Translate, Google Earth, Google Moderator, and Google FeedBurner, are now all IPv6 enabled.
When this day comes, someone must start finding IP address owners who does not really need a static address and give it to someone who needs it seriously. We may even see owners starting to sell their extra IPs at a price far more expensive that what it is worth today.
]]>IPv6 or Internet Protocol version 6 is the answer to our IPv4 problem. What problem? By 2011 or 2012 (according to estimates), there will be no more IPv4 addresses left. This means that, anyone with a need to have a static IP address will not be able to get any for their project or service.
When this day comes, someone must start finding IP address owners who does not really need a static address and give it to someone who needs it seriously. We may even see owners starting to sell their extra IPs at a price far more expensive that what it is worth today.
But that will not happen, because two decades ago, the powers-that-be already started experimenting with IPv6 which will give us 2128 addresses. That is equivalent to 340,282,366,920,938,463,463,374,607,431,768,211,456 IPv6 Addresses, according to my Einstein brain calculation :p Or simply: 340 with 36 zeroes (I admit, I used a calculator).
Compare that to IPv4 which only have 232 or 4,294,967,296 IP addresses. It is a huge difference! IPv6 which use 128-bit addresses and IPv4 which is only 32-bit. Each computer in the world can now have its own IP Address and we are only scratching the surface of IPv6. In fact, if we subtract the number of IPv4 addresses we have, we still have 340,282,366,920,938,463,463,374,607,427,473,244,160 IPv6 addresses available.
I know you have plenty of questions but time is not on our side. What I am going to answer for you today is how you can start connecting to the IPv6 Internet without waiting for your ISP to start implementing it.
For this tutorial or How-To Guide, I am going to show you how I setup my Ubuntu Linux 9.10 “Karmic Koala” Linux Mint 11 “Katya” 64-bit (based on Ubuntu 11.04 “Natty Narwhal”). So let’s begin!
Go to Synaptic (System -> Administration -> Synaptic Package Manager)
Search for: miredo; gogoc; and radvd and install all three.
Open a terminal (Accessories -> Terminal)
Type:
|
|
Type:
|
|
If your main connection is not eth0
then change if_prefix=
accordingly
If you are setting this up on a workstation computer, then change host_type=router
to host_type=host
Type:
|
|
Update 2010-03-29: Additional step from Ubuntu 10.04 “Lucid Lynx” and up.
Still on your terminal, type:
|
|
Look for # CHECK_KEYFILE="yes"
and change it to CHECK_KEYFILE="no"
Update 2009-12-23: An update from Jeremy Duncan on setting up your Linux box as a router.
Make sure IPV6FORWARDING
is set to yes in /etc/sysconfig/network
like so: IPV6FORWARDING=yes
.
You are done! To test if your IPv6 is working do or visit the following:
In your terminal, type:
|
|
it should show something like this:
|
|
Open up your favorite browser and visit test-ipv6.com
and/or ipv6-test.com
and/or ip6.me
For one, Miredo/Teredo was developed only as a temporary gateway to the IPv6 Internet. In fact, it was set as the last access point when you have other IPv6 implementation like a tunnel broker.
Another reason is to have a static IPv6 address (even if your ISP gives you a dynamic IPv4 address). For this to work, you have to register an account over at Gogo6.com’s Freenet6 service (register here).
Then you have to edit your gogoc.conf, follow the instructions below:
Open a Terminal again
Type:
|
|
Type:
|
|
Adjust your existing gogoc.conf with this one:
|
|
Type:
|
|
You’re done! From now on, you will have the same IPv6 address everytime you connect to Freenet6’s network. However, do note that you still get a different static IP depending on which Freenet6 server you are connected. If you really want to connect to the exact same server simply change this configuration in your gogoc.conf
|
|
to:
|
|
But before you do that, please connect to Freenet6 at least once, so your gogoc daemon will have a list of servers to connect to and be able to choose the “best” one for you. Then set it up as instructed, and you’ll be connecting to that same “best” server everytime the gogoc daemon is (re)-started. Easy?
Welcome to the next generation of the Internet - the IPv6 world.
Firefox 3.6 “Final” was released today and one of the major addition is the support for the Web Open Font Format or “WOFF”. The result of a collaboration between the font designers Erik van Blokland and Tal Leming with help from Mozilla’s Jonathan Kew.
What is it for? How can you use it? By using the CSS2 @font-face (yes CSS2 not CSS3). This new format is promising because of the large number of support from the font creators and font foundries. Hopefully this will be the first font format that Microsoft® will accept for Internet Explorer browser other than their existing Embedded OpenType or “EOT”.
If IE9 supports WOFF, then this format will be the first cross-browser @font-face/webfont format. There is no question when it comes to Chromium/Chrome, Opera, and Safari, the problem with cross-browser technology is always with MSIE.
Update: Microsoft added WOFF support in Internet Explorer 9 Platform Preview 3.
So how can you start using WOFF? Just follow these simple steps:
|
|
And here’s what happens when a browser reads your font stylesheet:
The table below presents which font format is supported by the four major browsers - Chromium/Chrome, Firefox, Internet Explorer, Opera, and Safari. As you will see, no font format is supported across all five browsers except for WOFF… in the near future.
Microsoft’s EOT is out of the race, even though many font creators and foundries support it, the other four browsers are likely never going to support it. Then OTF, SVG, and TTF are out too because Internet Explorer is surely never going to implement it, and font creators/foundries do not like these formats for @font-face use.
That is where WOFF comes in. Commercial font creators and font foundries wants control (or restriction if you want it that way) to the fonts that can be used for the CSS @font-face rule.
Of course there are other advantages to WOFF like compression. WOFF is compressed, which site administrators will like because it eats less bandwidth. You can go check the fonts that came with your FontSquirrel generated font kit, WOFF is the smallest of them.
For now as with all new technologies, we have to wait until all major browsers adds support for WOFF. But that should not stop you from using it today. Just like with CSS3 and some HTML5, you can use it right now. It will save you time later if you do the update now than whenever you feel like to, which you will probably forget.
Chrome (WebKit) |
Firefox (Gecko) |
IE (Trident) |
Opera (Presto) |
Safari (WebKit) |
|
---|---|---|---|---|---|
EOT | No | No | v4.0 | No | No |
OTF | No | v3.5 | No | v10.0 | v3.1 |
SVG | v0.3 | No | No | v10.0 | v3.1 |
TTF | v2.0 | v3.5 | No | v10.0 | v3.1 |
WOFF | v5.0 | v3.6 | v9.0 | No | No |
If you see the Baybayin writing script below, then your browser supports one of the font formats - EOT, OTF, SVG, TTF, or WOFF. If not, then you should upgrade your browser because my font stylesheet captures all browsers. (At least from my testing, on two computers without any Baybayin fonts - it displays correctly on all the major browsers.)
Filipino-Baybayin: ᜀᜅ᜔ ᜊᜓᜃᜓ ᜀᜌ᜔ ᜉᜍ ᜐ ᜆᜂ ᜇᜑᜒᜎ᜔ ᜏᜎ ᜈᜅ᜔ ᜉᜓᜏᜒᜇᜒᜅ᜔ ᜋᜁᜈᜓᜋ᜔ ᜈ ᜄᜆᜐ᜔᜶
Filipino-Latin: Ang buko ay para sa tao dahil wala nang puwedeng mainom na gatas.
English: The coconut is for people because there is not enough milk to drink.
Filipino-Baybayin: ᜉᜓᜏᜒᜇᜒ ᜃᜅ᜔ ᜌᜓᜋᜋᜈ᜔ ᜇᜑᜒᜎ᜔ ᜐ ᜊᜄᜓᜅ᜔ ᜍᜓᜎᜒᜆ᜶
Filipino-Latin: Puwede kang yumaman dahil sa bagong roleta.
English: You can be rich because of the new wheel.
Enjoy!
Sources:
For this post, I will talk about how to correctly declare the language of your content, this way you are being friendly with translation software and helper applications, and other technologies that rely on this often taken-for-granted HTML attribute. As is shown in our image, everyone can see the writing script used, but in the digital world there are people who do not have the fonts you are using. There are also people who do not use the same browser as you and me use - it could be a text-only browser, a speech browser, or a Braille browser.
It is then only appropriate that we properly and correctly tag our content with the language and script we are using. Get ready to use the LANG attribute a lot.
]]>In my previous post I talked about “Baybayin - the Forgotten Pre-Hispanic Writing of the Filipino”. It was added in version 5.0 of the Unicode Standard together with Buhid, Hanunoo, and Tagbanwa under the “Philippine Scripts” group. But how should we properly write or mark our content written in another language and script?
For this post, I will talk about how to correctly declare the language of your content, this way you are being friendly with translation software and helper applications, and other technologies that rely on this often taken-for-granted HTML attribute. As is shown in our image, everyone can see the writing script used, but in the digital world there are people who do not have the fonts you are using. There are also people who do not use the same browser as you and me use - it could be a text-only browser, a speech browser, or a Braille browser.
It is then only appropriate that we properly and correctly tag our content with the language and script we are using. Get ready to use the LANG attribute a lot.
When creating websites, it is important to properly declare the language being used on the webpage. For example, I use the following for my sites:
|
|
It is also important to declare the character set especially when you are going to use any characters beyond the scope of ASCII. This is how it looks like:
|
|
Putting it all together, our basic HTML should be.
|
|
Now let’s dig-in…
The HTML lang attribute defines the language of the content enclosed within the element it was declared. The codes are called subtag, and for my Filipino readers, there are only three subtag types you should worry about: language-Script-REGION. The full format: language-extended_language-Script-REGION-variant-extension-privateuse.
See the table below:
Code | Language | Subtag Placement |
---|---|---|
en | (Generic) English | language |
en-PH | Philippine English | language+REGION |
fil-Tglg | Filipino in Baybayin | language+Script |
bik-cts-Tglg | Bikolano of the Pandan (Northern Catanduanes) dialect in Baybayin script | language+extended_language+Script |
phi-Tglg-tsg | Tausug Philippine language written in Baybayin script | language+Script+variant |
If you want to find the subtags for a particular language, previously we have to check different websites and plenty of official code lists. A time-consuming task (although normally you only have to do this once), right? Well, the latest official subtags can now be found in the IANA Language Subtag Registry. It is now the universal source for all valid subtags.
According to the latest list (as of this writing), the subtags that are related to the Philippines are the following (if I missed anything, please leave a comment below):
Tagalog
Bikol
Cebuano
Filipino/Pilipino
Hiligaynon
Iloko
Pangasinan
Pampanga/Kapampangan
Philippine languages
Waray
Buhid
Hanunoo (Hanunóo)
Tagbanwa
Tagalog
Now that we have the subtags we need we can start coding the correct lang
value for any Philippines language and script. See these examples:
lang
value for your website: lang="en-PH"
lang="fil"
lang="tl"
lang="bik"
lang="ceb"
lang="hil"
lang="ilo"
lang="pag"
lang="pam"
lang="war"
lang="phi"
Then if you want to write something in Baybayin script you have to enclose it correctly with the script subtag “Tglg”. Remember, the format is: language-Script, like so:
lang="fil-Tglg"
lang="bik-Tglg"
lang="ceb-Tglg"
lang="phi-Tglg"
Why do we have no lang="tl-Tglg"
subtag code? Because of Suppress-Script: Latn , in the IANA Language Subtag Registry as was shown earlier. If I understood it correctly, it means that the Tagalog language as per the official standard should always be written in the Latin script. I assume then that lang=“tl-Tglg” is wrong and applications have the option to ignore it or drop the “Tglg” script subtag. In this case, just use “fil-Tglg”.
There is another subtag that you should learn if you want to target dialects and macrolanguages. You can find a list from the ISO standard ISO-639-3. Let’s use Bikolano as an example. The format to use is: language-extended_language-Script.
lang="bik-bcl"
lang="bik-bhk"
lang="bik-bto-Tglg"
lang="bik-cts-Tglg"
The language-extended_language-Script is, as of this article, still not yet implemented. The basis for the lang attribute is always the IANA Language Subtag Registry, once it has been updated to include extended_languages then we can start using it where needed.
Next is if your language have an ISO-639-3 code and is under or part of the language code “phi” in ISO-639-2, then the phi subtag is to be used. This subtag code is considered a collective language. Good examples are:
lang="phi-krj"
lang="phi-mdh"
lang="phi-Tglg-mrw"
lang="phi-Tglg-tsg"
As you probably have noticed the format I used was language-Script-variant and not language-extended_language-Script. My reasoning is simple - the phi language code is not really a language, it is accurately called a “collective” language entry in ISO-639-2 for all other Philippine languages not found in this version of the ISO language standard. Compare that to the bik language code, it was clearly marked as a “macrolanguage” both in ISO-639-2 and ISO-639-3.
Additionally, according to the World Wide Web Consortium or W3C, dialects of macrolanguages are considered/should be written immediately after the language subtag. In other words, if your ISO-639-2 code is considered a macrolanguage then you should use the extended_language subtag position like lang="bik-cts-Tglg"
. If it wasn’t defined as a macrolanguage, then you should use the variant subtag position as is the case in lang="phi-Tglg-tsg"
.
If you website is mainly about Iriga and you write in your own language, then you should adjust your website’s header files accordingly:
|
|
If you want to write “Happy Father’s Day” in Baybayin, this is how you do it:
|
|
Simple? Cool! Just remember that when writing language tags, keep it as simple and as short as possible. If you do not have a need to be very specific like say lang="bik-bcl"
then don’t be! Simply use lang="bik"
. This is especially true for blogs. So if your blog is in Filipino language (!not Tagalog!) then you use:
|
|
Only be specific when you need it or when your site caters mainly to that particular audience and/or region. Additionally, if you are going to use (which you probably will) other languages and scripts, enclose it always in a span or div element as I’ve shown in my Baybayin example above.
Easy? Yes it is. It takes time to get used to it, and yes, it is confusing at first. But you will get the hang of it eventually. Go on and update your websites now and start practising marking your content with the correct language and script.
I was planning on creating a Peso font if I can not find one, this was after the availability of the Peso sign was discussed during the [Event] Philippine Ubuntu 9.04 release party. My search turned-out positive, there’s not just one but countless of fonts with the Peso sign already included.
]]>Last night, I searched if there were fonts updated to include the Philippine Peso currency sign which has been added in Unicode since version 3.2 release. The Unicode position of the Peso sign is at point 20B1 if you want to check it out for yourself.
I was planning on creating a Peso font if I can not find one, this was after the availability of the Peso sign was discussed during the [Event] Philippine Ubuntu 9.04 release party. My search turned-out positive, there’s not just one but countless of fonts with the Peso sign already included.
This is the real Peso sign: ₱ – it is not an uppercase strike-through P. Here’s a comparison:
₱ | P |
Correct way | old way |
If you can not see the Peso sign above, then you do not have an updated font, or any font for that matter, with a Peso sign included. This also means that your fonts are possibly non-Unicode compliant. Time to update.
Here are some of the free-of-charge fonts that you can freely download and install, which already have the Peso sign included (U+20B1).
Start typing those Peso signs, the correct way!
Update 2010-11-14: You can now type the ₱eso sign directly from your keyboard simply by pressing RightAlt+P or AltGr+P. But before you can do that, you need to add the Philippines Unicode Keyboard Layout which is now available in both GNU/Linux and Windows®.
This only applies to “first-generation classic themes” or “traditional templates”.
Maybe you have read my HOW TO: Add DISQUS Manually on Blogger/BlogSpot but found it is for XML-based templates. Fret not, in this how-to, we are going to integrate DISQUS on your Blogger/BlogSpot Classic/Custom Template!
]]>Maybe you have read my HOW TO: Add DISQUS Manually on Blogger/BlogSpot but found it is for XML-based templates. Fret not, in this how-to, we are going to integrate DISQUS on your Blogger/BlogSpot Classic/Custom Template!
Check for updates below this guide. Latest update on Tuesday, 2009-04-28.
But first, thanks to Nathan Henderson for sharing the changes he did. I then added a few more edits to give the finishing touch. Last but definitely not the least, read this warning.
1.1: Add this to your CSS area or CSS file:
|
|
Step 2 is for the “0 Comment”; “1 Comment”; “10 Comments” link that shows on your main page.
2.1: Look for:
|
|
OR
|
|
2.2: Change it to:
|
|
OR
|
|
This step is for “0 Comment”; “1 Comment”; “10 Comments” text that shows up when viewing a single post. Also note that this piece of code is not present in some templates by-design, so skip to Step 4.
3.1: Look for:
|
|
OR
|
|
3.2: Change it to:
|
|
OR
|
|
4.1: Look for:
|
|
4.2: Change it to:
|
|
4.3: Look for:
|
|
4.4: Change it to:
|
|
5.1: Look for:
|
|
5.2: Add above/before:
|
|
5.3: In Step 5.2, change the DISQUS-SHORT-NAME to your blog’s DISQUS URL.
Example, if your DISQUS URL is libresoftware.disqus.com then change DISQUS-SHORT-NAME to libresoftware. There is one to change.
6.1: Look for:
|
|
6.2: Add above:
|
|
6.3: In step 6.2, change the DISQUS-SHORT-NAME to your blog’s DISQUS URL.
Again, if your DISQUS URL is libresoftware.disqus.com then change DISQUS-SHORT-NAME to libresoftware. Only one to change here.
You’re done! Congratulations!
Some notes to remember. This how-to guide was designed to still show the comments posted via your built-in comment system (Blogger’s in this case), while at the same disabling the ability to post new comments using the old system by removing the link.
For the adventurous, you can also find the DISQUS API here.
Friday, 2013-08-02: Updated the JavaScript code to reflect the latest disqus script in steps 5 and 6
Saturday, 2008-06-14
Saturday, 2008-08-02: The tutorial was added at DISQUS help forums by Andrew (from Disqus). Thank you very much and I’m glad to be of help to the community!
Saturday, 2008-08-23: Changed /{YOUR-DISQUS-URL}/ to /DISQUS-SHORT-URL/ to avoid confusion. Thanks to hackcrack for the suggestion.
Tuesday, 2009-04-28: Corrected Steps 5.2 and 6.2. Hat tip to chrisdfeld for catching the errors.
Tuesday, 2011-07-06: Fixed typographical error in Step 5.2, thanks to lil-bee for bringing it to my attention
If you have other questions, don’t hesitate to reply in our Disqus-powered comments or the official Disqus forums!
This guide was last updated on 2008 and since then Disqus created an automated method. It is strongly suggested to use it by visiting this link and then switch to the correct site.
If like me you are using DISQUS for your blog or site comments system, then maybe you’ve encountered a problem with integrating it to your custom theme/template. In this simple tutorial, I will show you which code bits to edit to successfully integrate Disqus into your Google Blogger/BlogSpot XML-based template. (Basically it is the same with any theme/template regardless of your blog platform or CMS.)
But if you have a Classic Template, then read my HOW TO: Integrate DISQUS on Blogger/BlogSpot Classic Template instead.
]]>If like me you are using DISQUS for your blog or site comments system, then maybe you’ve encountered a problem with integrating it to your custom theme/template. In this simple tutorial, I will show you which code bits to edit to successfully integrate Disqus into your Google Blogger/BlogSpot XML-based template. (Basically it is the same with any theme/template regardless of your blog platform or CMS.)
But if you have a Classic Template, then read my HOW TO: Integrate DISQUS on Blogger/BlogSpot Classic Template instead.
Check for updates below this guide. Latest update: Saturday, 2008-08-23.
With that said, let’s begin!
This step is for the “0 Comment”; “1 Comment”; “10 Comments” link that shows on your main page.
1.1: Add this to your CSS area or CSS file
|
|
2.1: Look for:
|
|
2.2: Change it to:
|
|
Step 3 is for the “0 Comment”; “1 Comment”; “10 Comments” text that shows when viewing a specific post. Some templates do not have this, so if you can’t find it, skip to Step 4.
3.1: Look for:
|
|
3.2: Change it to:
|
|
4.1: Look for:
|
|
4.2: Usually, above the code bit in 4.1, you will find this:
|
|
It may be enclosed on a DIV tag instead of a P element. Additionally, sometimes you may find that it’s arranged differently, if so, just look for any bits similar to 4.1.
4.3: Once you find it, change it to:
|
|
5.1: Look for:
|
|
5.2: Above it add:
|
|
Note: If above the code bit shown in 5.1 there is a </b:if>, then put the code bit in 5.2 before </b:if>. If it isn’t there, as in some templates, you probably have to add it.
6.1: Look for:
|
|
6.2: Add above:
|
|
6.3: In Step 6.2, change the DISQUS-SHORT-URL to your blog’s DISQUS URL.
Again, if your DISQUS URL is libresoftware.disqus.com then change DISQUS-SHORT-URL to libresoftware, there is only one to change.
At this point, you are done when all is working fine. Congratulations!
Some things to remember. This how-to was designed to still show the comments posted on your built-in comment system (usually Blogger’s) while at the same time disabling any new comments from being posted using the built-in comment system, by removing the link to do so. However, if your visitors knows the direct link to Blogger’s built-in comment system, they can still leave comments the old way.
To effectively disable it without hiding all earlier comments, you need to edit the Post Options of each of your posts and change it to “Don’t allow, show existing”. Later, Disqus will introduce an import feature, so all old comments will be copied to your Disqus as well. Until then, this is the solution that I can think of.
For the adventurous, you can find information on the Disqus API by visiting the official developers webpage.
Hope that helps!
Friday, 2013-08-02: Updated the JavaScript code to reflect the latest disqus script in steps 5 and 6
Saturday, 2008-05-24: Thanks to Disqus’ Daniel Ha for featuring this how-to article on the official website! Glad to be of help.
Monday, 2008-05-26: Chinese (Taiwan) version [教學]Blogger如何手動安裝Disqus with screenshots by Joyce Wu.
Saturday, 2008-06-14: I updated step 6. I missed to change a Disqus URL to DISQUS-SHORT-URL, it was previously pulling data from “highstreet5”. Please check your codes on step 6.
Saturday, 2008-08-02: The tutorial was added at Disqus help forums by Andrew (from Disqus). Thank you very much and I’m glad to be of help to the community!
Saturday, 2008-08-23: Changed /{YOUR-DISQUS-URL}/ to /DISQUS-SHORT-URL/ to avoid confusion. Thanks to hackcrack.
If you have other questions, don’t hesitate to post a reply in our Disqus powered comments system.