Stebalien's Blog

Imageshack: Media hosting for the web

Caveat lector: I wrote this post in high school; it’s likely outdated and poorly written.

I have seen imageshack used a lot but have never tried it myself until now.

Problem

Bloggers image hosting is limited (100mb) and does not work with lightbox.

Solution

Imageshack works great with blogger and lightbox. It allows for easy posting of small thumbnails that link to the bigger image. Normally the thumbnail would link to a web page containing the full version of the image but this is not compatible with lightbox (lightbox needs the actual image). The fix is very easy: Simply change the image link to the thumbnail link but remove the .th from in front of the extension.

My main complaint is that the thumbnails are too small. I could get around this by using the full image and scaling it down with css but this would wast some of my 300mb per image per hour bandwidth (not really a problem now but may become problematic with more readers).

Edit: My main complaint is that they lose images. Imageshack (along with pretty much every other media hosting site) is great for forum posts, but not for semi-permanent blogs.

HOWTO: Create a floating sidebar on the left (Minima)

Caveat lector: I wrote this post in high school; it’s likely outdated and poorly written.

It took me a while to get the floating sidebar on the left of this page working well so I decided to write this post in order to save others time and frustration. I made this tutorial for the Minima template but you could modify it in order to work with any template.

Add this:

/* Floating sidebar on left */
#fixedsidebar-wrapper {
  position: fixed;
  top: 75px;
  left: 10px;
  width: 100px;
  float: left;
  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
  overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#big-wrapper {
  margin: 0 150px 0 100px;
}

Below this:

#sidebar-wrapper {
  width: 220px;
  float: $endSide;
  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
  overflow: hidden;     /* fix for long non-text content breaking IE sidebar float */
}

Then, to fix the page elements tab…

Add this:

/** Page structure tweaks for layout editor wireframe for floating sidebar on left **/

body#layout #outer-wrapper,
body#layout #header-wrapper,
body#layout #footer {
  width: 500px;
  padding: 0px;
}
body#layout #main-wrapper {
  width: 300px;
}
body#layout #sidebar-wrapper {
  width: 200px;
}
body#layout #newsidebar-wrapper {
  width: 150px;
}

…below the previous code.

To remove the dotted line under widgets…

Add this:

#fixedsidebar.sidebar .widget {
  border-bottom-width: 0 !important;
}

Below this:

.sidebar .widget, .main .widget {
  border-bottom:1px dotted $bordercolor;
  margin:0 0 1.5em;
  padding:0 0 1.5em;
}

Then add <div id="big-wrapper"> just under <body>. This will make sure that the floating sidebar will not overlap the other content.

Now in order to actually place the sidebar…

Add this:

      <div id="fixedsidebar-wrapper">
   <b:section class="sidebar" id="fixedsidebar" preferred="yes">
      <b:widget id="NewProfile" locked="false" title="'About" type="Profile" />
    </b:widget>
  </b:section>
</div>

Below this:

    <div id="content-wrapper">
 <div id="crosscol-wrapper" style="">
   <b:section class="crosscol" id="crosscol" showaddelement="no" />
 </b:section>
</div>

Finally, add a </div> tag before the </body> tag to close the “big-wrapper”

This post is heavily based on this tutorial but creates a fixed (floating) sidebar instead of a sidebar that scrolls with the rest of the page.

For advertisement free browsing: apply Adblock Plus

Caveat lector: I wrote this post in high school; it’s likely outdated and poorly written.

Adblock Plus is a great Firefox extension that blocks advertisements. Advertisements hog bandwidth and are distracting. It is easy to use (right click and select block element).

Here is my adblock plus filter list (save it as a text document and import it).

(Adblock Plus 0.7 or higher required) [Adblock]
@@netstream
@@http://www.microsoft.com/
@@http://www.windowsmarketplace.com/
@@|http://www.kiisfm.com/
@@|http://www.apple.com/
@@|https://www.windwardschool.org/
@@|http://iwonderdesigns.com/
@@|http://news.bbc.co.uk/
@@|http://wow.weather.com/
@@|http://www.defensedevices.com/
@@http://www2.gawker.com/assets/minify.php?files=*
@@http://syndication.mmismm.com/
@@http://tags.gawker.com/
*.2o7.net/*
*/shopping_deals*
*/tacoda/*
*_fromoursponsors_*
/(\W|_)(ad(s)?(vert(is(ement|ing|er)?)?)?)(s)?(view|log|image(s)?|Links|counter|serve(r)?|sys|brite|sonar|lengend|side|files)?(\W|_|1)/
/[\W_](blog|get|online)ad(s)?[\W_]/
/[\W_](double|fast)click[\W_]/
/\.geocities.com/js_source/(ygNSLib9|pu5geo).js/
/\D(728|588|468|234|160|120)x(600?|90)\D/
http://*.sageanalyst.net/*
http://*.centrport.net/*
http://*.falkag.net/*
http://*.industrybrains.com/*
http://*.itnation.com/*
http://*.questionmarket.com/*
http://*.spinbox.net/*
http://*.tiser.com.*/
http://*.tribalfusion.com/*
http://*.valueclick.com/*
http://*theglobeandmail.com/adsv3/*
http://ehg*.hitbox.com/*
http://graphics8.nytimes.com/marketing/
http://images.pcworld.com/shared/graphics/bevel_*.gif
http://images.stardock.com/store/*
http://images.usatoday.com/kk/classified/*
http://infospace.abcnews.com/*/adinsert.js
http://media.nyadmcncserve*.com/
http://media.washingtonpost.com/wp-srv/popjs/popup*
http://msnbc.msn.com/#DIV(p2)
http://msnbc.msn.com/#DIV(textSmallGrey)
http://msnbc.msn.com/*#DIV(clr)
http://msnbc.msn.com/*#DIV(w779)
http://pagead2.googlesyndication.com/*
http://rcm.amazon.com/e/cm?t=*
http://servedby.*
http://server.*.liveperson.net/*
http://www.goodsforyou.com/*
http://www.humaxusa.com/*
http://www.insanely-great.com/*/adsb.cgi*
http://www.kiisfm.com/cc-common/CCAS_media/ccas_creative_81152.gif
/.*(-|_|/)promo(-|_).*\.(gif|png|jpg)/
http://www.qksrv.net/*
intellitxt
*/promotions/*
http://us.a1.yimg.com/*
http://download-search.search.com/search?v=og&q=*
http://i.d.com.com/*/*_sponsors_*.gif
http://www.ftjcfx.com/*
|http://*.addfreestats.com/*
/http://feeds\.(\w|\W)+\.com/~[a]/(\w|\W)+\?.=(\w|\W)+/
http://*.casalemedia.com/*
http://www.lduhtrp.net/*
http://www.afcyhf.com/*
http://www.shareasale.com/*
http://3ps.go.com/DynamicAd?*
/[\W|_](((p|P)romo)(tional)?)?(_)?(promo(s)?|banner)(s)?(_)?(up|down|standard|right|left|top|bottom)?([0-9])?\.(gif|png|jpg|bmp)/
http://*.atwola.com/*
http://ccas.clearchannel.com/*&affiliate=*
http://network.business.com/*
http://affiliates.digitalriver.com/*
http://clk.atdmt.com/*
http://www.awltovhc.com/image-*
http://*.adland.ru/*
http://www.macdailynews.com/adpeeps/*
http://rss.sourceforge.net/~a/*
http://cgi.insecure.org/cgi-bin/pro/*
http://affiliates.babylon.com/*
http://view.atdmt.com/*
/.*(_|/)sponsor(s)?((\.(gif|jpg|png))|(/))/
http://bs.serving-sys.com/BurstingPipe/BannerSource.asp?*
*/web_banners/*
*/bin/ad
http://*.google.com/pagead/*
*/images/banner*.png
http://s1.amazon.com/exec/varzea/tipbox/*
*_sweeps*
http://www.conduit.com/banners/*
*adpartner*
http://digg.com/img/feature-*.gif
http://*.freesoftwaremagazine.com/openads/*
http://regmedia.co.uk/*
http://www.siteground.com/img/banners_cust/2*
http://ubuntulinuxhelp.com/hic300250.gif
http://www.tqlkg.com/*
http://groups.google.com/groups/adfetch?*
http://banner.casinotropez.com/*
http://www.speedsuccess.net/*
#*(sponsored_links_article)
#*(ad_bottom)
#*(ad_top)
#*(launchpad-ads-3)
#*(sponsorship)
#*(sponsorshiphack)
#*(promo2)
#*(ad_300)
#*(ad_180)
#*(adbannerblock)
#*(ad34)
#*(googlesyndication)
##div.banner ad + *
google.com#TABLE(cellpadding=9)(border=0)
openssh.com#BLINK
google.com#a(href^=https://www.google.com/ads)
babelfish.yahoo.com#DIV(ovt)
cnet.com#DIV(class=asl_margin)
cnet.com#DIV(class=rb_pft_ad)
#DIV(id=spons_links)
#DIV(class=columnGroup advertisementColumnGroup)
#A(href^=http://www.servage.net/?coupon=)
flickr.com#DIV(id=AdBlock)
youtube.com#DIV(id=leaderboardAd)
google.com#TD(rowspan=5)
google.com##TD[onmouseover="return ss()"]
google.com#H2(class=sl f)
#DIV(class=sponsor)
youtube.com#NOSCRIPT(class=noscript-show)
google.com#DIV(id=tpa1)
linuxforums.org#DIV(id=topbanner)
linuxforums.org#NOSCRIPT(class=noscript-show)
linuxquestions.org#NOSCRIPT(class=noscript-show)
#DIV(id=rightad)
#DIV(id=topad)(class=ad)
#A(class=sponsoredlink)
#DIV(id=ad-top)
#DIV(class=banner ad)
opendns.com#UL(class=adkeywords)
google.com##TABLE.contentitem[cellspacing="0"][cellpadding="5"][border="0"][bgcolor="#ffffff"][style]
google.com##TD[nowrap][onmouseover="return true"]
google.com#*(href^=http://www.google.com/sponsoredlinks?)
builtwith.com#DIV(class=featuredTechnology)
flashlinux.org.uk#DIV(id=portlet-dtm)
#*(id=sponsors)
#DIV(id=ads)
techcrunch.com#A(href=/advertise/)
#A(href^=http://www.google.com/pagead)
dictionary.reference.com#A(href^=http://www.google.com/url?sa=L&ai=)
#IMG(src^=http://ad.uk.doubleclick.net)
#IMG(src^=http://ad.doubleclick.net)
yahoo.com#A(href=http://us.ard.yahoo.com/SIG=12lt27gkl/M=570179.11705344.12177319.9641256/D=yahoo_top/S=2716149:HDLN/_ylt=AvsqK7FgUbxkrtlnjbKs1lP1cSkA/Y=YAHOO/EXP=1193800089/A=5005233/R=0/SIG=14m0dtrqi/*https://www.getsmart.com/refi/qform.asp?bp=ltquickmatch&esourceid=1271910&promo=00221&num=1-866-262-6895&AdType=2&version=45&disable_popups=1&init=1)
howstuffworks.com#A(class=reify-linkifier)
#DIV(class=topbanners)
#DIV(id=holidayad)
#DIV(class=doubleClickAd)
#*(class=doubleClick)
#DIV(class=adText)
guide.opendns.com#DIV(id=noresultsads)
#DIV(class=ad_itext_bar)
search.com#UL(class=sponsored)
experts-exchange.com#DIV(class=ontopBanner)
guide.opendns.com#DIV(id=adbox)
us.f812.mail.yahoo.com#TABLE(id=welcomeAdsContainer)
books.google.com#DIV(class=ad)
weather.yahoo.com#DIV(class=yw-ad)
lifehacker.com#DIV(id=sitemeter)
#DIV(class=advertContainer)

Taboo: Can't read it now? Save it for later.

Caveat lector: I wrote this post in high school; it’s likely outdated and poorly written.

Taboo is basically a temporary bookmarks manager. If you have found an article that you find interesting but it is too long you would normally have 3 options.

  1. Bookmark it.
  2. Leave the tab open and move on.
  3. Close the tab and find it in your history.

All of these options have one major problem: Clutter. Bookmarks can either be stored in a menu or the bookmarks toolbar. This is fine for sites that are frequented often or are permanent references but temporary bookmarks make the perminant bookmarks harder to find. A separate temporary bookmarks folder is fine but it can be very hard to find a specific bookmark mixed in with all of the other temporary bookmarks. Leaving the bookmark in your tabbar makes sorting through your tabs frustrating. The history is normaly erased after a set period of time ind is a pain to look through.

Taboo solves these problems. If you can’t remember the sites name, you can look for the thumbnail of the site. If you can only remember when you looked at the site you can view your taboos in calendar mode. If you know that you added your taboo recently (within the last 10 or so) you can use the menu attached to the “View Taboos” button as the list is sorted by most recently added. Taboo is a beta so more features should appear as time goes on.

Screenshots:

Scribefire: Cool but not perfect

Caveat lector: I wrote this post in high school; it’s likely outdated and poorly written.

Scribefire is a very useful extension and can even upload images to blogger but has a few annoying “bugs” for lack of a better word.

Scribefire pre-release and dark-themes (gtk) don’t mix well (it looks very ugly). Scribefire current release works better with dark themes but not perfectly.

Scribefire can upload images but does not upload them to the standard server (it uploads them to “Picasa web albums”) and, unlike the default editor, it simply places a shrunken version of the image on the webpage and does not link it to its bigger version. This is easily fixable but annoying (especially when using lightbox).

Too many features and few options to trim down the UI.

Verdict: Fun but not for me (yet).

Gnome-Blog debs

Caveat lector: I wrote this post in high school; it’s likely outdated and poorly written.

I have just uploaded the patched gnome-blog deb and an updated python-gdata deb (gnome-blog requires python-gdata 1.0.1 or up but gutsy only includes 1.0). The python-gdata is unnecessary if you use hardy but is a later version than the one provided by hardy.

My PPA:

deb http://ppa.launchpad.net/stebalien/ubuntu gutsy main
deb-src http://ppa.launchpad.net/stebalien/ubuntu gutsy main

Edit: I got the patch from http://bugzilla.gnome.org/show_bug.cgi?id=151291 (thanks to Richard Schwarting)

PDF tools

Caveat lector: I wrote this post in high school; it’s likely outdated and poorly written.

A while back I wrote a script that can convert PDFs into several other formats. It can also print information about PDFs. I recommend you use this script in conjunction with nautilus-actions.

Usage

./PDFtools.sh [pdf document]

Screenshots

Main Window:

Info:

Font Info:

This script requires poppler-tools and zenity

Copy Script From: PDFTools.sh

Gnome-Blog (patched)

Caveat lector: I wrote this post in high school; it’s likely outdated and poorly written.

I have just patched gnome-blog (and spent hours tweaking it) and it now correctly posts titles with blogger. I will post the install instructions along with the gutsy packages required tomorrow.

P.S.

I am posting this from gnome-blog.

BloGTK + tomboy-blogposter + gnome-blog

Caveat lector: I wrote this post in high school; it’s likely outdated and poorly written.

I have tested BloGTK + tomboy-blogposter + gnome-blog and all of them have problems with blogger. Gnome-blog is the simplest. It is a panel applet for the gnome-panel and has a very clean, simple, and fast interface. On the other hand, BloGTK is a standalone app that is a little bulky. Neither of these programs will post titles of posts correctly (BloGTK refuses to allow a title at all and gnome-blog posts the title as part of the body of the post). Tomboy-Blogposter does post the title correctly (because it uses the new API) but does not allow for HTML (links etc…). I am therefore resigned to look for another program (I will try Scribfire next).

Edit: Gnome-Blog cannot post pictures to blogger.