Automatic editable htm photo album

General chit chat about razor, not specifically related to a topic but about razorCMS

Automatic editable htm photo album

Postby edsousa84 » Fri Nov 25, 2011 4:22 pm

Does razorcms allow to upload multiple images and they appear in the text area inline so i can add text between them.

Example:
http://paginas.fe.up.pt/~aas/pub/Varios ... _Santiago/
This one was generated with picasa and then uploaded to a website, I wold like to do it with just a CMS

If it is not possible is it easy to implement i know some php? Is it easy to set a string in the text area? And what inserting a button on the editing area to do a multiple upload of images?

Thank you
edsousa84
 

Re: Automatic editable htm photo album

Postby Adminer » Fri Nov 25, 2011 11:42 pm

edsousa84 wrote:Does razorcms allow to upload multiple images and they appear in the text area inline so i can add text between them.
http://paginas.fe.up.pt/~aas/pub/Varios ... _Santiago/
This one was generated with picasa and then uploaded to a website, I wold like to do it with just a CMS
If it is not possible is it easy to implement i know some php? Is it easy to set a string in the text area? And what inserting a button on the editing area to do a multiple upload of images?
Thank you


IMHO, This example was generated by... Adobe Web Album - not Picasa.
Single upload image is possible by using ckeditor blade pack and filemanager there.
Picasa, it's a software to manage your images and to upload them into your acount such like this: http://tinyurl.com/bqvpjbl
It's not easy to do that with cms - some kind of software can: http://code.google.com/p/pwi/
So, cms should generate a html code like this:
Code: Select all
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>   
      <title>Picassa Webalbum</title>
      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js"></script>
      <link rel="stylesheet" type="text/css" href="js/jquery.fancybox/jquery.fancybox-1.3.4.css"/>
      <script type="text/javascript" src="js/jquery.fancybox/jquery.fancybox-1.3.4.pack.js"></script>
      <link   href="css/pwi.css" rel="stylesheet" type="text/css"/>
      <script src="js/jquery.pwi.js" type="text/javascript"></script>
      <script type="text/javascript">
      
          $(document).ready(function() {
              $("#container1").pwi({
                  username: 'jdiderik',
                  mode: 'albums',
               thumbSize: 160,
               maxResults: 10,
                  albums: ["ConcertRacoon","ISMLasVegas2007"]
              });
            
            
            $("#container2").pwi({
                  username: 'jdiderik',
               maxResults: 5,
               mode: 'latest',
               popupExt: function(photos){ photos.fancybox(); }
              });

            $("#container3").pwi({
                  username: 'jdiderik',
               mode: 'album',
               album: 'Test',
               albumMaxResults: 5,
               popupExt: function(photos){ photos.fancybox(); }
              });
            
         
              $("#container4").pwi({
                  username: 'jdiderik',
                  mode: 'albums',
               thumbSize: 160,
               maxResults: 10,
                  albums: ["Dance Parade 2007","Test"]
              });

          });
      </script>

   </head>
   <body>
   <h3><a href="index.html">PWI</a> Demo 1, Selective albums view</h3>
   <div id="container1"> </div>
   <h2><a href="index.html">PWI</a> Demo 2, Selective albums view</h2>
   <div id="container2"> </div>
   <h2><a href="index.html">PWI</a> Demo 3, Selective albums view</h2>
   <div id="container3"> </div>
   <h2><a href="index.html">PWI</a> Demo 4, Selective albums view</h2>
   <div id="container4"> </div>
   </body>
</html>


It's very easy to create a line with your galery images from picasa acount using <div id="container1"> </div>
but the album name should be in this java code - not easy to manage it.

Another trick is to use Picasa RSS feed. When you have created your galeries there, you can copy RSS link and paste into razorCMS blade pack.
Something about this is here: http://tinyurl.com/ca3l9n2 and here: http://magpierss.sourceforge.net/
http://solidgone.org/Lightweight-php-picasa-api


That blade may be used to display images from Pisaca gallery as you wish.

Pro: easy to create your own gallery on very bad hosting with razorCMS.
Cons: Google licencing tell us, that we are not an owner of our photos from this moment, and google can use it.

By the way, I like photography - it's my big hobby, but you should know, that if I have big LCD monitor, all your photos from your example are like a post stamps on my big screen. So, I recomended to change the idea of photo presentation, with migration to something like this:
http://tinyurl.com/cuzmx5p
:geek:

Regards
Adminer
 
Posts: 578
Joined: Wed Apr 08, 2009 9:52 pm
Location: Poland

Re: Automatic editable htm photo album

Postby ettadorsch » Thu Nov 15, 2012 2:42 am

how to create own gallery?
ettadorsch
 
Posts: 1
Joined: Thu Nov 15, 2012 1:41 am


Return to General Discussions

Who is online

Users browsing this forum: No registered users and 2 guests

cron