DadOverflow.com

Musings of a dad with too much time on his hands and not enough to do. Wait. Reverse that.

Page 50 of 57

Watermarking Jupyter Notebooks, Part 2

In a previous post, I explored different ways in which I might be able to add a watermark to my Jupyter Notebooks.  I also referenced an interesting approach that would allow me to a) watermark all my notebooks at once and b) only have to write CSS once and write it entirely outside of any notebook.  Well, I decided to go ahead and give that approach a try.  Here are my results.

Step 1: Create your custom.css

The post I found on theming your notebooks suggested that you should place your custom CSS in a custom.css file here: ~/.jupyter/custom/custom.css

The tilde is supposed to represent your home directory; although, in different installations of Jupyter Notebooks that I’ve seen, I’ve found the “home” directory for Jupyter to not necessarily be your Windows home directory.  At any rate, on my home computer, I found my Jupyter folder here: %USERPROFILE%\.jupyter

Interestingly, when I navigated to the that folder, I found no “custom” directory.  So, I created one and then created a blank custom.css within it.

Step 2: Add the necessary CSS to custom.css

Next, I opened my blank custom.css in Notepad++ and added the following CSS code (apologies for the horizontal scrolling, but I’m not entirely sure how to properly format HTML code in a CSS file):


1
2
3
4
div#notebook {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' height='600px' width='600px'><text x='-350' y='500' fill='lightgray' font-size='80' font-family='Arial' transform='translate(30) rotate(-45 0 0)'>DadOverflow.com</text></svg>");
    background-repeat: repeat;
}

Step 3: Start up Jupyter, create a new notebook, and profit!

Now, with your newly minted custom.css, launch Jupyter Notebook and start a new notebook…or even open up an existing one.  You’ll now see your watermark magically appear:

Pretty cool, eh?

Preparing for college and career

My eldest is finishing up her junior year of high school; thus, we’re deep in the throes of college planning. It’s quite an intimidating process and I’m doing what I can to educate myself as fast as possible. This post will be Part 1 of N number of posts about the adventure of college and career planning for my kids.

As podcasts are a chief conduit for my learning, I’m always looking for content that speak to the challenge of helping your kids prepare for college and career. One that I’ve found recently is the Plan for College Now podcast. The fourth episode–Get hired! Be the grad every employer will want to hire!–is dense with material for the soon-to-be college graduate, but can easily be applied to high schoolers and even present day laborers. Here are notes I took on this episode that you may find useful.

Think career first

The traditional American template for college planning seems to be: 1) choose a college that feels like the right fit for you, 2) once at that college, choose a major that feels like a good fit, and 3) once in that major, near your graduation date, begin to ponder your career options. This thinking is backwards. Individuals should: 1) first peruse the job market and try to identify several potential careers that might fit their goals, then 2) identify one or more college majors that match such careers and finally 3) match those majors to an appropriate college.

Prepare for the working world

You should constantly be monitoring the job market, especially in order to pick a degree that won’t soon go obsolete. As an aside, I’m reminded of the book Worthless that I read recently imploring youth not to pick degrees that aren’t worth the price of tuition. Someday I’ll have to write a review of that book.

Students should build their set of skills. Mentorships and internships are two important ways to do this. Would developing a specialty in your field of study boost your earning potential and increase your marketability? If so, specialize! The host then rattled off a number of ways you can set up an internship:

Network

Yes, actually talking to people can help you land a great job. Of course, the 21st century puts an interesting spin on this time-tested tradition. You can begin networking by simply talking to family, friends, school career counselors, professors, and school administrators. Another aside: check out this Art of Maniless podcast on the Art of Mingling…I imagine those skills would be very helpful in developing a professional network.

Later in the podcast, the host interviewed an expert of professional networking and she offered these tips for getting started building your network:

  • Tip 1: Focus on the outcomes of building relationships for your future career, not just your current job. This tip certainly speaks to me. I am not an extrovert and so, when I’m happy in my present job, I don’t feel inclined to be social with other professionals. Big mistake. I should always be thinking about building my professional network–you never know what sort of wonderful opportunity might be out there.
  • Tip 2: Communicate what you do, how you do it, and who you do it for so that people can see how they’ll benefit from meeting you.
  • Tip 3: Don’t forget to develop your online profile. Include a picture, too. Remember that your online networking and your profile is your marketing brochure. LinkedIn, of course, seems the obvious place to begin this work.
  • Tip 4: Create a routine of reaching out, especially with LinkedIn requests.

Social Media dos and don’ts

Do: use social media vehicles, such as LinkedIn, to stay in touch with people in particular industries in which you’re interested
Don’t: use social media for foolishness. Don’t be vulgar online, don’t post indiscreet pictures, and be extremely careful about posting your social and political views. There are plenty of stories out there about people losing job opportunities because of foolish things they’ve done online. Heck, in the recent NFL draft, one draftee might have placed his career at stake for stupid statements he posted while in high school. Take this lesson seriously!

Research the job market

The host reeled off a number of awesome tools and sites for researching hot industries and jobs:

Students should ask themselves, what skills are employers looking for in new hires? Apparently, the site Inside Higher Ed has some helpful hints in this area.

Regarding STEM jobs (Science, Technology, Engineering, Math), host Jim Wilkerson had this piece of wisdom:

“It’s a high tech digital world, folks, so you better embrace it because that’s where the jobs are going to be and the good paying jobs, as well.”

Agreed (but I am a little biased).

Employers want employees with excellent written and verbal skills. I certainly concur. Should you wish to improve these skills, check out this list of free writing courses.

Apparently, you can tailor your job market research by geographies of interest or interest in simply working from home. To that end, he mentioned the following resources:

Of course, the work-from-home-thing is rife with scams, so check out these resources to make sure that awesome work-from-home opportunity isn’t too good to be true:

Maintain good physical and financial health

I took some issue with this part of the podcast. The host said, “due to the high cost of financial stress, many companies now do credit checks on all new hires.” Really? Is that even legal? He was suggesting that it can be expensive for companies to hire professionals that are distracted by their personal financial issues and/or succumb to illness from such stress. I suppose that makes sense, but I just can’t see how that would fly in today’s super anti-discrimination climate. The host goes on to talk about the importance of staying physically healthy and certainly offer the appearance of being physically healthy. I’m sure appearing physically ill or unfit (or appearing old, like me) will diminish your job prospects to some degree, but, again, I would guess today’s climate would rail against such things.

Learn about your prospective companies

The host summed up this point pretty succinctly:

“Never go into an interview without looking at their [the company’s] website….Employers are not impressed with candidates who don’t take the time to complete this simple step.”

Research the company to which you are applying and/or interviewing with. Read press releases, read their website, and read about their core values. In your cover letter, include the same language they use in their values statements, mission and goals. Your resume and cover letter should include words from their job description in case they do word matches to compare your resume to their job posting and make sure your resume is tailored for the job to which you’re applying. Here are two more resources he noted to help with this endeavor:

Also, never lie to your prospective employer. You will get caught and it won’t be pretty.

Your attitude

Whether networking or interviewing, project the right attitude: be energetic, confident, make eye contact, and be positive. Think about what value you can offer the company and make sure you speak in these terms.

“Always keep your eye on the goal: a good job offer once you graduate.” (Jim Wilkerson)

Again, this was a great podcast brimming over with valuable resources to help your child or even yourself succeed in the job market. The only other thing I would add that doesn’t seem to get mentioned in these types of discussions is Entrepreneurship. I try to always make sure my kids know that there is a second option: come up with a great idea and build a business around it yourself. Keep your options open and understand that there’s more than one route to success.

Watermarking Jupyter Notebooks

Watermarked content can be annoying, but I get it: you work hard on a product and you should get credit for it. At my job, I sometimes have the same challenges–I work hard on a report or product, hand it over to the co-worker who requested it, and he takes it to upper management passing the content off, either unintentionally or otherwise, as his own. If only I could in some way watermark my work to make it clear where it originated.

Since I do a fair amount of work these days in Jupyter Notebook, I decided to take this question there and came up with three approaches:

1. The traditional image file approach

The most common approach to watermarking a web page seems to be creating an image file with your watermark and referencing that image file in your CSS. In Jupyter Notebook, you can use the IPython API to load your CSS:


1
2
3
4
5
6
7
8
from IPython.core.display import HTML


HTML('<style type="text/css">'
    'div#notebook {'
    'background-image: url("dadoverflow_wm.png");'
    'background-repeat: repeat;}'
    '</style>')

(The full notebook is here)

Alternatively, you can use this clever custom.css approach so that your watermark loads automatically in all your notebooks without any extra coding on your part.

One big drawback to this solution is that if you hand off your notebook to your customer, that image file needs to go with it. If your customer wants to get rid of your watermark, all he has to do is throw away the image file. Bummer!

2. Base64 encode that image file

Files can be embedded in a web page, so to speak, by base64 encoding them and pasting the encoding right into your HTML. You can take this approach with your watermark and then never have to worry about the image file having to travel side-by-side with your notebook. Here, I first base64 encode my image file and then use the IPython API to shove my markup, including my base64, into the CSS:


1
2
3
4
5
6
7
8
9
10
11
12
13
import base64
from IPython.core.display import HTML


with open('dadoverflow_wm.png', 'rb') as f:
    encoded_string = base64.b64encode(f.read()).decode()
   
image_url = 'data:image/png;base64,{0}'.format(encoded_string)
HTML('<style type="text/css">'
    'div#notebook {'
    'background-image: url("' + image_url + '");'
    'background-repeat: repeat;}'
    '</style>')

(The full notebook is here)

Same deal as above, you can also paste that markup in a custom.css that all your notebooks will inherit. While this eliminates your dependence on that image file, base64 strings, like this one, are huge! It is not fun dealing with such things. Fortunately, there’s yet a better solution.

3. The SVG way

SVG tags are the continuum transfunctioners of HTML–their mystery is only exceeded by their power. But you can do amazing things with SVGs, watermarking your pages among them. Here, I don’t even need to rely on an image file, base64 encode or not. I simply adjust the properties of my SVG and TEXT tags as needed to get the effect I’m after:


1
2
3
4
5
6
7
8
9
10
from IPython.core.display import HTML


svg = ("<svg xmlns='http://www.w3.org/2000/svg' version='1.1' height='600px' width='600px'>"
       "<text x='-350' y='500' fill='lightgray' font-size='80' font-family='Arial' transform='translate(30) rotate(-45 0 0)'>DadOverflow.com</text></svg>")
HTML('<style type="text/css">'
    'div#notebook {'
    'background-image: url("data:image/svg+xml;utf8,' + svg + '");'
    'background-repeat: repeat;}'
    '</style>')

 

You can find all three of these examples in my GitHub page.

« Older posts Newer posts »

© 2025 DadOverflow.com

Theme by Anders NorenUp ↑