{"id":592,"date":"2007-04-11T07:05:52","date_gmt":"2007-04-11T07:05:52","guid":{"rendered":"http:\/\/www.nargalzius.com\/blog2\/http:\/www.nargalzius.com\/blog2\/archives\/2007\/04\/2007_04_11_1505.php"},"modified":"2017-02-10T02:30:54","modified_gmt":"2017-02-10T02:30:54","slug":"why-you-should-use-flickr","status":"publish","type":"post","link":"http:\/\/nargalzius.com\/blog\/archives\/2007\/04\/11\/why-you-should-use-flickr","title":{"rendered":"Why you should use Flickr"},"content":{"rendered":"<img decoding=\"async\" src=\"http:\/\/farm1.static.flickr.com\/238\/455009423_33334400c7_o.gif\" align=\"right\" \/>\n<p>It&#8217;s been a long while since I last posted anything &#8211; doing NYC hours for work can really take its toll on you. But during the day, when not doing errands, or hanging out with my girlfriend (or sleeping). I&#8217;ve been tweaking <em>nargalzius.com<\/em> quite a bit.<\/p>\n<p>Of course a lot of other stuff has happened but lets save those for another day. This time I just want to pimp <a href=\"http:\/\/www.flickr.com\" title=\"Flickr\">Flickr<\/a> after something I recently did with my site.<\/p>\n<p>Just recently, I <em>finally<\/em> convinced myself to sign-up with <a href=\"http:\/\/www.flickr.com\" title=\"Flickr\">Flickr<\/a>&#8216;s premium membership to lift the limitations of the free service (infinite upload bandwidth and collection\/set creation, etc.).<\/p>\n<p>Now I&#8217;ve always had the preference to use <a href=\"http:\/\/www.flickr.com\" title=\"Flickr\">Flickr<\/a> for all my picture needs. After all, even the free service they have already has pleny-a-benefit if you want to have reliable image hosting that can embedded anywhere. I even didn&#8217;t mind the premium membership price because it was well worth it.<\/p>\n<p>The <strong>only<\/strong> reason I didn&#8217;t go all-<a href=\"http:\/\/www.flickr.com\" title=\"Flickr\">Flickr<\/a> was because for a &#8220;<em>personal<\/em> gallery,&#8221; I really wanted people accessing it through my domain and have the layout\/design gel with my sites overall theme. Hence, I used to have a separate gallery for my actual photo sets. And just used <a href=\"http:\/\/www.flickr.com\" title=\"Flickr\">Flickr<\/a> as a general repository for images I use for blog posts.<!--more--><a href=\"http:\/\/www.flickr.com\" title=\"Flickr\">flickr<\/a>: <a href=\"http:\/\/www.flickr.com\">http:\/\/www.flickr.com<\/a> &#8220;Flickr&#8221;<\/p>\n<p>The benefits of using a web-based service like <a href=\"http:\/\/www.flickr.com\" title=\"Flickr\">Flickr<\/a> basically has the same usefulness as a GMail account &#8211; you have a ton of space <em>online<\/em> <span class=\"footnote_referrer\"><a role=\"button\" tabindex=\"0\" onclick=\"footnote_moveToReference_592_1('footnote_plugin_reference_592_1_1');\" onkeypress=\"footnote_moveToReference_592_1('footnote_plugin_reference_592_1_1');\" ><sup id=\"footnote_plugin_tooltip_592_1_1\" class=\"footnote_plugin_tooltip_text\">1 <\/sup><\/a><span id=\"footnote_plugin_tooltip_text_592_1_1\" class=\"footnote_tooltip\">Which means [in a web-developer&#8217;s perspective] offsetting space\/bandwidth from site.<\/span><\/span><script type=\"text\/javascript\"> jQuery('#footnote_plugin_tooltip_592_1_1').tooltip({ tip: '#footnote_plugin_tooltip_text_592_1_1', tipClass: 'footnote_tooltip', effect: 'fade', predelay: 0, fadeInSpeed: 200, delay: 400, fadeOutSpeed: 200, position: 'top right', relative: true, offset: [10, 10], });<\/script> which you can access anytime.<\/p>\n<p>Obviously I got frustrated having to juggle two &#8220;galleries&#8221; at the same time &#8211; so I did some searching for a gallery script that uses <a href=\"http:\/\/www.flickr.com\" title=\"Flickr\">Flickr<\/a>&#8216;s API. <span class=\"footnote_referrer\"><a role=\"button\" tabindex=\"0\" onclick=\"footnote_moveToReference_592_1('footnote_plugin_reference_592_1_2');\" onkeypress=\"footnote_moveToReference_592_1('footnote_plugin_reference_592_1_2');\" ><sup id=\"footnote_plugin_tooltip_592_1_2\" class=\"footnote_plugin_tooltip_text\">2 <\/sup><\/a><span id=\"footnote_plugin_tooltip_text_592_1_2\" class=\"footnote_tooltip\">Application Program Interface<\/span><\/span><script type=\"text\/javascript\"> jQuery('#footnote_plugin_tooltip_592_1_2').tooltip({ tip: '#footnote_plugin_tooltip_text_592_1_2', tipClass: 'footnote_tooltip', effect: 'fade', predelay: 0, fadeInSpeed: 200, delay: 400, fadeOutSpeed: 200, position: 'top right', relative: true, offset: [10, 10], });<\/script><\/p>\n<p>I found this:<\/p>\n<div align=\"center\">\n<a rel=\"lightbox\" href=\"http:\/\/farm1.static.flickr.com\/222\/454888661_212d00e084_o.png\" target=\"_blank\" title=\"You may click on the image for more details\"><img decoding=\"async\" alt=\"\" src=\"http:\/\/farm1.static.flickr.com\/222\/454888661_4161c53b78_m.jpg\"><\/a><br>\n<em>Lumis Gallery<\/em>\n<\/div>\n<p>It&#8217;s called the <a href=\"http:\/\/www.lumis.com\/lumisGallery\" title=\"Lumis Gallery\">Lumis Gallery<\/a> &#8211; a gallery script that interfaces with the <a href=\"http:\/\/www.flickr.com\" title=\"Flickr\">Flickr<\/a> API! It allows you to access Flickr data and display it in local pages of your webserver. It still boggles me why I searched for something like this only now.<\/p>\n<p>I installed and modified it like I usually do &#8211; my new <a href=\"http:\/\/www.nargalzius.com\/gallery\" title=\"nGallery\">bad-ass gallery<\/a> is the result. I&#8217;ve disabled a bunch of &#8220;features&#8221; <span class=\"footnote_referrer\"><a role=\"button\" tabindex=\"0\" onclick=\"footnote_moveToReference_592_1('footnote_plugin_reference_592_1_3');\" onkeypress=\"footnote_moveToReference_592_1('footnote_plugin_reference_592_1_3');\" ><sup id=\"footnote_plugin_tooltip_592_1_3\" class=\"footnote_plugin_tooltip_text\">3 <\/sup><\/a><span id=\"footnote_plugin_tooltip_text_592_1_3\" class=\"footnote_tooltip\">tagging, geomaps, photo blog, etc.<\/span><\/span><script type=\"text\/javascript\"> jQuery('#footnote_plugin_tooltip_592_1_3').tooltip({ tip: '#footnote_plugin_tooltip_text_592_1_3', tipClass: 'footnote_tooltip', effect: 'fade', predelay: 0, fadeInSpeed: 200, delay: 400, fadeOutSpeed: 200, position: 'top right', relative: true, offset: [10, 10], });<\/script> from the <a href=\"http:\/\/www.lumis.com\/lumisGallery\" title=\"Lumis Gallery\">Lumis Gallery<\/a> which I didn&#8217;t think I needed and added some stuff in as well. Let me take you on a quick tour:<\/p>\n<p>The default page you&#8217;ll be seeing would be the <em>sets page<\/em> &#8211; where it shows all current sets I have. Aside from the obvious layout\/design change, the other modification I did here  is that I added a link to toggle between the <em>photostream<\/em> and <em>photo sets.<\/em><\/p>\n<div align=\"center\">\n<a rel=\"lightbox\" href=\"http:\/\/farm1.static.flickr.com\/241\/454873355_cffd916552_o.png\" target=\"_blank\" title=\"You may click on the image for more details\"><img decoding=\"async\" alt=\"\" src=\"http:\/\/farm1.static.flickr.com\/241\/454873355_4c97621725_m.jpg\"><\/a>\n<\/div>\n<p>After selecting and clicking on a set, you&#8217;ll be led to the that particular set&#8217;s page as shown below. The modification I did here was to add a &#8220;slideshow&#8221; link &#8211; because I myself like viewing pictures via slideshow especially if there are a lot of pictures to browse through (saves a bunch of mouse clicks).<\/p>\n<p>You can see from the picture that there are a bunch of cool features as well &#8211; like the instant image popup which gives you a quick glimpse of the image you&#8217;re mousing-over.<\/p>\n<div align=\"center\">\n<a rel=\"lightbox\" href=\"http:\/\/farm1.static.flickr.com\/224\/454873577_cea79fb49d_o.png\" target=\"_blank\" title=\"You may click on the image for more details\"><img decoding=\"async\" alt=\"\" src=\"http:\/\/farm1.static.flickr.com\/224\/454873577_8e416357ab_m.jpg\"><\/a>\n<\/div>\n<p>Clicking on a picture would lead to that picture&#8217;s detail page that shows all the information you need. EXIF data (if available), which sets the picture belongs to, its location in the photostream, the date it was created, etc.<\/p>\n<p>The single coolest feature that sold me was that it even supported <em>notes!<\/em> Displaying comments (complete with user icons) is a nice touch as well. Normally, if the photo had notes, it would disable the lightbox feature (since it&#8217;s overlayed on the image) &#8211; I hacked it so it would have a little text link to the lightbox on the bottom left should there be notes.<\/p>\n<div align=\"center\">\n<a rel=\"lightbox\" href=\"http:\/\/farm1.static.flickr.com\/208\/454858564_0c24d0fde2_o.png\" target=\"_blank\" title=\"You may click on the image for more details\"><img decoding=\"async\" alt=\"\" src=\"http:\/\/farm1.static.flickr.com\/208\/454858564_8a77c1fdd6_m.jpg\"><\/a>\n<\/div>\n<p>The last &#8220;view&#8221; available to you would be the <em>photostream<\/em> <span class=\"footnote_referrer\"><a role=\"button\" tabindex=\"0\" onclick=\"footnote_moveToReference_592_1('footnote_plugin_reference_592_1_4');\" onkeypress=\"footnote_moveToReference_592_1('footnote_plugin_reference_592_1_4');\" ><sup id=\"footnote_plugin_tooltip_592_1_4\" class=\"footnote_plugin_tooltip_text\">4 <\/sup><\/a><span id=\"footnote_plugin_tooltip_text_592_1_4\" class=\"footnote_tooltip\">Flickr&#8217;s default user view on their official site.<\/span><\/span><script type=\"text\/javascript\"> jQuery('#footnote_plugin_tooltip_592_1_4').tooltip({ tip: '#footnote_plugin_tooltip_text_592_1_4', tipClass: 'footnote_tooltip', effect: 'fade', predelay: 0, fadeInSpeed: 200, delay: 400, fadeOutSpeed: 200, position: 'top right', relative: true, offset: [10, 10], });<\/script> which basically is a brute-force listing of all the photos [in order of date uploaded, newest first] on my <a href=\"http:\/\/www.flickr.com\" title=\"Flickr\">Flickr<\/a> account &#8211; it&#8217;s useful since you can immediately see if there has been new content uploaded from the last time you visited.<\/p>\n<p>It also has some added features like [temporarily] re-sorting the images and setting the size\/type of the thumbnails. Since it essentially displays individual photos, then you also have the instant image details popup available. And just like the <em>set view<\/em>, I also added a link to view the stream as a slideshow.<\/p>\n<div align=\"center\">\n<a rel=\"lightbox\" href=\"http:\/\/farm1.static.flickr.com\/232\/454873141_3b4448e1eb_o.png\" target=\"_blank\" title=\"You may click on the image for more details\"><img decoding=\"async\" alt=\"\" src=\"http:\/\/farm1.static.flickr.com\/232\/454873141_1015c0c578_m.jpg\"><\/a>\n<\/div>\n<p>Basically the gallery pretty much behaves like <a href=\"http:\/\/www.flickr.com\" title=\"Flickr\">Flickr<\/a> does, and I have to say &#8211; the <a href=\"http:\/\/www.flickr.com\" title=\"Flickr\">Flickr<\/a> people know how design an intuitive user-interface. Not to mention editing\/reogranizing\/tagging\/etc. is so easy to do.<\/p>\n<hr \/>\n<p>I&#8217;ve already adjusted my lightbox to now redirect everything to my new gallery &#8211; and of course the gallery in turn still has a link back to the images\/sets&#8217; respective <a href=\"http:\/\/www.flickr.com\" title=\"Flickr\">Flickr<\/a> pages &#8211; so I don&#8217;t think I&#8217;m breaking any terms of conditions here. <span class=\"footnote_referrer\"><a role=\"button\" tabindex=\"0\" onclick=\"footnote_moveToReference_592_1('footnote_plugin_reference_592_1_5');\" onkeypress=\"footnote_moveToReference_592_1('footnote_plugin_reference_592_1_5');\" ><sup id=\"footnote_plugin_tooltip_592_1_5\" class=\"footnote_plugin_tooltip_text\">5 <\/sup><\/a><span id=\"footnote_plugin_tooltip_text_592_1_5\" class=\"footnote_tooltip\">Or at least am bending it at a forgivable level.<\/span><\/span><script type=\"text\/javascript\"> jQuery('#footnote_plugin_tooltip_592_1_5').tooltip({ tip: '#footnote_plugin_tooltip_text_592_1_5', tipClass: 'footnote_tooltip', effect: 'fade', predelay: 0, fadeInSpeed: 200, delay: 400, fadeOutSpeed: 200, position: 'top right', relative: true, offset: [10, 10], });<\/script><\/p>\n<p>I did however take out the &#8220;lumis&#8221; gallery copyright &#8211; not because I want to take credit for the gallery but simply because that&#8217;s how I have my design behave (no extraneous data).<\/p>\n<p>To make up for that however, I&#8217;m more than willing to pimp\/plug the <a href=\"http:\/\/www.lumis.com\/lumisGallery\" title=\"Lumis Gallery\">Lumis Gallery<\/a> whenever I get the chance (like what I&#8217;m doing in this post. Much respect goes out to the developer of the <a href=\"http:\/\/www.lumis.com\/lumisGallery\" title=\"Lumis Gallery\">Lumis Gallery<\/a><\/p>\n<hr \/>\n<p>Well? What are you waiting for? Stop checking out the screenshots and visit the new <a href=\"http:\/\/www.nargalzius.com\/gallery\" title=\"nGallery\">Gallery<\/a> for a first-hand experience!<\/p><div class=\"speaker-mute footnotes_reference_container\"> <div class=\"footnote_container_prepare\"><p><span role=\"button\" tabindex=\"0\" class=\"footnote_reference_container_label pointer\" onclick=\"footnote_expand_collapse_reference_container_592_1();\">Notes<\/span><span role=\"button\" tabindex=\"0\" class=\"footnote_reference_container_collapse_button\" style=\"display: none;\" onclick=\"footnote_expand_collapse_reference_container_592_1();\">[<a id=\"footnote_reference_container_collapse_button_592_1\">+<\/a>]<\/span><\/p><\/div> <div id=\"footnote_references_container_592_1\" style=\"\"><table class=\"footnotes_table footnote-reference-container\"><caption class=\"accessibility\">Notes<\/caption> <tbody> \r\n\r\n<tr class=\"footnotes_plugin_reference_row\"> <th scope=\"row\" class=\"footnote_plugin_index_combi pointer\"  onclick=\"footnote_moveToAnchor_592_1('footnote_plugin_tooltip_592_1_1');\"><a id=\"footnote_plugin_reference_592_1_1\" class=\"footnote_backlink\"><span class=\"footnote_index_arrow\">&#8673;<\/span>1<\/a><\/th> <td class=\"footnote_plugin_text\">Which means [in a web-developer&#8217;s perspective] offsetting space\/bandwidth from site.<\/td><\/tr>\r\n\r\n<tr class=\"footnotes_plugin_reference_row\"> <th scope=\"row\" class=\"footnote_plugin_index_combi pointer\"  onclick=\"footnote_moveToAnchor_592_1('footnote_plugin_tooltip_592_1_2');\"><a id=\"footnote_plugin_reference_592_1_2\" class=\"footnote_backlink\"><span class=\"footnote_index_arrow\">&#8673;<\/span>2<\/a><\/th> <td class=\"footnote_plugin_text\">Application Program Interface<\/td><\/tr>\r\n\r\n<tr class=\"footnotes_plugin_reference_row\"> <th scope=\"row\" class=\"footnote_plugin_index_combi pointer\"  onclick=\"footnote_moveToAnchor_592_1('footnote_plugin_tooltip_592_1_3');\"><a id=\"footnote_plugin_reference_592_1_3\" class=\"footnote_backlink\"><span class=\"footnote_index_arrow\">&#8673;<\/span>3<\/a><\/th> <td class=\"footnote_plugin_text\">tagging, geomaps, photo blog, etc.<\/td><\/tr>\r\n\r\n<tr class=\"footnotes_plugin_reference_row\"> <th scope=\"row\" class=\"footnote_plugin_index_combi pointer\"  onclick=\"footnote_moveToAnchor_592_1('footnote_plugin_tooltip_592_1_4');\"><a id=\"footnote_plugin_reference_592_1_4\" class=\"footnote_backlink\"><span class=\"footnote_index_arrow\">&#8673;<\/span>4<\/a><\/th> <td class=\"footnote_plugin_text\">Flickr&#8217;s default user view on their official site.<\/td><\/tr>\r\n\r\n<tr class=\"footnotes_plugin_reference_row\"> <th scope=\"row\" class=\"footnote_plugin_index_combi pointer\"  onclick=\"footnote_moveToAnchor_592_1('footnote_plugin_tooltip_592_1_5');\"><a id=\"footnote_plugin_reference_592_1_5\" class=\"footnote_backlink\"><span class=\"footnote_index_arrow\">&#8673;<\/span>5<\/a><\/th> <td class=\"footnote_plugin_text\">Or at least am bending it at a forgivable level.<\/td><\/tr>\r\n\r\n <\/tbody> <\/table> <\/div><\/div><script type=\"text\/javascript\"> function footnote_expand_reference_container_592_1() { jQuery('#footnote_references_container_592_1').show(); jQuery('#footnote_reference_container_collapse_button_592_1').text('\u2212'); } function footnote_collapse_reference_container_592_1() { jQuery('#footnote_references_container_592_1').hide(); jQuery('#footnote_reference_container_collapse_button_592_1').text('+'); } function footnote_expand_collapse_reference_container_592_1() { if (jQuery('#footnote_references_container_592_1').is(':hidden')) { footnote_expand_reference_container_592_1(); } else { footnote_collapse_reference_container_592_1(); } } function footnote_moveToReference_592_1(p_str_TargetID) { footnote_expand_reference_container_592_1(); var l_obj_Target = jQuery('#' + p_str_TargetID); if (l_obj_Target.length) { jQuery( 'html, body' ).delay( 0 ); jQuery('html, body').animate({ scrollTop: l_obj_Target.offset().top - window.innerHeight * 0.2 }, 380); } } function footnote_moveToAnchor_592_1(p_str_TargetID) { footnote_expand_reference_container_592_1(); var l_obj_Target = jQuery('#' + p_str_TargetID); if (l_obj_Target.length) { jQuery( 'html, body' ).delay( 0 ); jQuery('html, body').animate({ scrollTop: l_obj_Target.offset().top - window.innerHeight * 0.2 }, 380); } }<\/script>","protected":false},"excerpt":{"rendered":"<p>: http:\/\/www.flickr.com &#8220;Flickr&#8221; It&#8217;s been a long while since I last posted anything &#8211; doing NYC hours for work can really take its toll on you. But during the day, when not doing errands, or hanging out with my girlfriend (or sleeping). I&#8217;ve been tweaking nargalzius.com quite a bit. Of course a lot of other &hellip; <p class=\"link-more\"><a href=\"http:\/\/nargalzius.com\/blog\/archives\/2007\/04\/11\/why-you-should-use-flickr\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Why you should use Flickr&#8221;<\/span><\/a><\/p><\/p>","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":{"image_generator_settings":{"template":"highway","enabled":false},"version":2}},"categories":[5,9,12],"tags":[441,465,595,709,810,830,909],"class_list":["post-592","post","type-post","status-publish","format-standard","hentry","category-internet","category-nargalzius","category-photography","tag-flickr","tag-gallery","tag-internet","tag-lumis","tag-nargalzius","tag-ngallery","tag-photography"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack-related-posts":[],"_links":{"self":[{"href":"http:\/\/nargalzius.com\/blog\/wp-json\/wp\/v2\/posts\/592","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/nargalzius.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/nargalzius.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/nargalzius.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/nargalzius.com\/blog\/wp-json\/wp\/v2\/comments?post=592"}],"version-history":[{"count":1,"href":"http:\/\/nargalzius.com\/blog\/wp-json\/wp\/v2\/posts\/592\/revisions"}],"predecessor-version":[{"id":1720,"href":"http:\/\/nargalzius.com\/blog\/wp-json\/wp\/v2\/posts\/592\/revisions\/1720"}],"wp:attachment":[{"href":"http:\/\/nargalzius.com\/blog\/wp-json\/wp\/v2\/media?parent=592"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/nargalzius.com\/blog\/wp-json\/wp\/v2\/categories?post=592"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/nargalzius.com\/blog\/wp-json\/wp\/v2\/tags?post=592"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}