Tag Archives: commands

Quick Guide to Patching Linux Icon Packs

One of the nice advantages of using Linux is the wealth of customization options available. A key area of  that customization are app icons. For those unfamiliar, it is similar to how icons change across Android versions, even though the apps themselves are often the same.

Now I could go over how to install icons packs, however there are countless sites who already explain the process very well, such as Tips on Ubuntu. As for obtaining icon packs, a great site is OpenDesktop.org, which among other things hosts a wide variety of free to use icon packs.

So, now onto something less commonly covered, patching icon sets (no coding or art skills required). First a little background, if you use one of the more popular icon packs, you’ll likely have no issues. However many of the smaller icon packs either only support certain distros or lack icons for lesser known programs.

Take for example my all time favorite icon pack, Oranchelo, it is geared mainly towards Ubuntu. Lately I’ve been using Fedora 28 and while some icons work liked they’re supposed to, others, which work in Ubuntu, do not. So why is that?

Each program has an icon name, and while many programs keep a consistent icon name across distros, this is not always the case, such as with some of the default Gnome apps in Fedora vs Ubuntu. To fix this we need to either change the app’s icon name or create symbolic links to the current icon name, the latter generally being the better option.

First we need to find the current icon name, for all common (and probably for the uncommon ones as well) Linux desktop environments the way to do this is:

cd /usr/share/applications/

Here you will see (using the ls command) a bunch of .desktop files, these are config files that set how a program will be shown on the desktop, such as what will it be called under English or under Polish, as well as what the icon should be.

I’ve already patched Oranchelo for most of my applications but I’ve yet to do it for the IceCat browser (located towards the bottom on the screenshot), so I’ll use it as an example. Since we already have our terminal located in the right folder, lets just search for the right .desktop file:

ls | grep -i icecat

From that command we now know that full name of the file is “icecat.desktop”. Now that we see the file, we just need to find what it’s icon name is:

cat icecat.desktop | grep -i icon

Now that we know what the icon is called (“icecat”, icon names aren’t always this simple), we needed to open up our installed icon pack, if you’re not sure where that is, look back on the install instructions you used for your pack and just find where you placed said pack.

I generally prefer to look at the icons in a graphical file manager, so that I can make sure I pick the right one.

So now that we’re in the file, we want to go into apps, then scalable. Here we have all our icons, once we found one that we like, we need to create a symbolic link.

Since Oranchelo doesn’t currently have an Icecat logo, I will use the firefox nightly icon.

Now we need to open a terminal at this location and do the following command (depending on where you installed your icons, you may or may not need to use sudo)

ln -s icon.svg desiredApp.svg

Or in my case:

ln -s firefox-nightly-icon.svg icecat.svg

Now all we need to do is toggle the icons, simply switch to the system default icon set and then switch back and the correct icons will show.

As you can see, the desired icon is now set for Icecat

However this is not the only way to patch icon sets, some icon sets are designed to only replace a small amount of icons, such as folders. These often use inheritance to fill the void, however you may not always like the set from which they inherit the remainder, or you may simply prefer if it inherited from a different set.

One of my favorite Gnome themes, Canta, comes with its own icon pack that replaces folders but inherits the rest from Numix icon pack, but since I haven’t installed Numix, it defaults to the system default. However, I have the Flat Remix pack installed, I’ll make it instead inherit from that.

As before, we need to go into the icon pack folder. Once we’re in the canta icon pack, we need to open up the index.theme file with a text editor (as before, depending on where it is installed, you may or may not need sudo).

A few lines from the bottom you will see a “Inherits=”. For Canta it is:

"Inherits=Numix-Circle,Adwaita,gnome,hicolor"

So if we want it to inherit from flat remix (provided flat remix is installed correctly), all we need to do is add it in, changing the line to:

"Inherits=Flat-Remix,Numix-Circle,Adwaita,gnome,hicolor"

Once you save the file, all the missing icons should be automatically inherited from Flat Remix.

Best of luck with all your Linux customization.

So You Want To Learn HTML? (Part 1: What IS HTML?)

Hi there! If you’ve clicked on this article, there is a non zero chance you want to learn HTML.

Today, I will be going over some of the basics of HTML. But first we must answer the question:

What IS HTML?

HTML Stands for HyperText Markup Language, and it provides the backbone for the code that makes up most web pages you visit on a daily basis. HTML code is usually written and modified using a variety of tags, styles and scripts.

  • Tags are the backbone of HTML, providing a basic structure for web pages.
  • Styles allow a web developer to modify the layout of a webpage but modifying attributes like the positioning, color, or size of elements on the webpage.
  • Scripts allow a web developer to create ways for users to interact with webpages in a variety of ways.

Today, we will be creating a basic HTML document. To begin, open up A simple text editor. The most common/easy to use for this exercise are Notepad (Windows) or TextEdit (Mac).

notepad-blank.bb647ae001a4fc7d168c240e01088787[1]

This is where we’ll begin. As previously stated, tags are the backbone of an HTML document, and are what we’ll be using to create a very basic text page. Every tag has an opening tag and closing tag. Text is then placed in between these tags.

Let’s run through a quick example: To create a full header tag, one would simply type the opening tag for a header: <h1>, followed by some text, and finally, the closing header tag: </h1>. Altogether, it would look something like this:

<h1> This is what a header looks like! </h1>?

Got that? To break it down one last time:

<h1> is our opening tag. It tells the document, “hey, I’m about to start a header tag. The stuff to follow is going to make a header for my page!”

</h1> tells the document, “I’m done writing the header now. Close it up!”

On a very basic level, this is all it takes to write a line of HTML code. Now, let’s dive into a few of the basic tag types.

Tag Types

Today we will be going over two very basic HTML tags to help give you a taste of writing HTML code.

Header

The header tag is a very important one, usually used to format the title of a webpage. We worked with it a bit up above, but there’s an extra part about headers that is important to know, for formatting purposes. The number that comes after the “h” in the header tag ranges from 1-6. These numbers rank the “importance” of each header in a given HTML document. Each rank, from <h1> all the way to <h6>, produce a progressively smaller header.

Consider the following block of code:

<h1> This is what an h1 header looks like! </h1>
<h2> This is what an h2 header looks like! </h2>
<h3> This is what an h3 header looks like! </h3>
<h4> This is what an h4 header looks like! </h4>
<h5> This is what an h5 header looks like! </h5>
<h6> This is what an h6 header looks like! </h6>

This code, when saved and viewed as an HTML document, looks like this:

headers

As we can see, each successive “rank” in our headers produces a smaller and smaller line, with the last couple of lines ending up quite small. This allows you to create “sub headers” to rank and organize items on your page by importance.

Paragraph

The paragraph tag is a simple and elegant way of “wrapping” text in your document, so that it doesn’t all stay together on one, long line. To represent a paragraph, use the following structure:

<p> This is my paragraph! By using this tag, it will wrap all of the text that I’m typing inside of it to make it much nicer to look at and read in my HTML document. Thanks <p> tag! </p>

Now that we’ve learned a couple of HTML tags, let’s use them to whip up your own HTML document!

  1. Open up Notepad, TextEdit, or similar text program.
  2. Type the following on the first line: <h1> This is my first HTML Document!</h1>
  3. On the next line, copy and paste the following: <p> The paragraph tag allows me to input text into my document, and format it to make it readable!</p>
  4. Finally type an <h2> header, with your name, and the date. Don’t forget to close the tag!
  5. Save the file as an HTML document. To do this, when naming the file, type ‘.html’ after the file name (for example: MyFirstHTML.html). Save it somewhere on your computer that is easily accessible.

Your final code should look something like this:

<h1> This is my first HTML Document!</h1>
<p> The paragraph tag allows me to input text into my document,  and format it to make it readable!</p>
<h2> First Name Last Name, October 4, 2016 </h2>

When you try to open up the HTML document, it should look like this:

headers

Congratulations! This article provides a very basic overview of HTML, and teaches you the basics of creating your first HTML document. Next time, we will discuss some more basic structural tags, as well as begin discussing styles, which will allow us to further modify the layout and color, as well as other features of our web page.

Terminal Basics

In OS X or Linux, you can do a lot with Terminal. This is where you can enter in commands, and your computer will execute them. You can do anything from basic file management, to running programs, to even playing games. But in order to do all that, you have to start with the basics. Here are a few commands you’ll need to get a grip on first. Continue reading