World of Birds

The experimental World of Birds Website on the dazzling EVO2 by Semiomantics is finished and will soon be presented as an alternative – or addition – to the outdated current website!

World of Birds on EVO2

Here a few screenshots of the main menu items on my World of Birds on EVO2 website:

Welcome Page

No website without an inviting Welcome Page…

Mission (About) Page

No company without a Mission, no private person without an About Page… so what are we looking at? What’s behind all of this? Where do they come from and what do they stand for?

Species Page (Overview)

World of Birds has almost 500 different Species… so a good place to categorize for the benefit of researching readers. . .

Image Gallery (1 of 3 at the time)

The Image Gallery here offers small fast-loading thumbnails. When clicked on, these thumbnails open in larger images! Brilliant way of presentation, saving time for slow lines…

By the way… as of this morning I got everything to work smoothly, however, as lunch time approaches, the net is getting very slow again! I just need a few more minutes and I’m off to the beach!

Movie Gallery

See the above image for the Movie Gallery; here I would obviously want to see a real nice movie on World of Birds. I did some research on YouTube and was actually shocked by what I saw – given the breathtaking beauty of this unique sanctuary. This will be my focus should this project come to fruition. For the time being it’s just my joy – both of getting into the intricacies of the new dazzling EVO2 and using some of my Digital Photography – without good photos there is no good website or website development anymore – that’s just as it is!

News Page

Yes, I like the News Page and while I looked at it through bird’s eyes here, many things can be imagined depending on the ideas and needs of the client!

Contact Page

No website without a smart and inter-active Contact Page with a call to action for those who are looking for what we offer. Obviously, the client’s name and details would show here and it’s easy enough to leave a comment or request on the Contact Form.

EVO2 on Semiomantics Review

Evo2 on Semiomantics is simply the best WordPress based Script and Content Framework when it comes to creating an attractive, inter-active as well as informative website for just any client, meaning for products and services alike. It’s setup is well planned and while I still have to dig into some code and experiment some more, within the timeframe I had I could go a long way to demystify what looked so complex. Obviously, I have a good foundation from having worked quite intentively with Evolution Scripts. Whenever I struggled, it was due to slow connections, cookies and cache issues – so it’s a good idea to prepare on the computer and upload once completed.

Congratulations to the developer of this spectacular script – Semiomantics, what else! I am glad to have my license, thank you!

Integration EVO2 into Semiomantics XO2011

While I’m off to feast now, my next step would be the Integration of this EVO2 website into Semiomantics XO211, in other words having it feature on the dynamicHomepage of my Google efficient Author Blog!

Christmas is over – so the meerkats have to move back into the Kalahari! Well… some of them located into their own manor at “World of Birds” in Hout Bay!

Therefore… this has to happen before 2011!

Will it work? We’ll see!

World of Birds Web Design

While I wish a Happy Christmas to everybody celebrating today, we did so yesterday and thus have some time to follow our passions today! This may mean walking on the beach, chatting with friends – or all of that plus following one’s passion – and one of mine is the brand-new EVO2 on Semiomantics – here’s the Mission page (some call it “About”)  for my experimental World of Birds Web Design. Click on the image and it will enlarge a bit in the overlay.

This part was fast and smooth with great explanations onsite. Brilliant!

World of Birds Web Design

Even before attacking the Mission Page for my “World of Birds” Web Design, I prepared the three image galleries – Birds, Mammals and Lizards – thumbnails en al.

So far, so good – nothing complicate dhere, just concentrated and very exact work needed. However. . .

For whatever reasons… and despite many trials – the lizards show, the rest don’t! No birds, no mammals – nada! All in the Xmas pudding!

I did it double, compared the code, the dots and the brackets on all pages, redid it from scratch, changed the names, stood on my head and closed down my PC for 2 hours – no go! The thumbnails and images simply don’t show -  fullstop!

OK! It might well be the connection – not the first time I save and ‘it’ doesn’t save. Let’s see what faster connections will bring tomorrow; meanwhile I will join the evening party! Cheeeers!

Dazzling EVO2 by Semiomantics

The final Ycademy Seminar 2010 introduced the dazzling EVO2 by Semiomantics – a new learning curve as to the Code and Script, but long-awaited and, finally, even I could get to it – here my first steps:

World of Birds on EVO2

For my first steps on EVO2 by Semiomantics, I chose a project that’s been close to my heart since a while: the unique bird sanctuary set within a tropical garden – “World of Birds” – in Hout Bay, South Africa… just 20 minutes away from where I live… and the largest bird park in Africa. Imagine over 3000 birds… probable about 500 species… and not only birds but also small mammals, reptiles and especially monkeys.

Many years ago, I got to know it intrinsically while working on a documentary for the European TV Industry, now I noticed the existing website is outdated and does not reflect the magic of this unique place.

The fact is, I admire this project that is based on the passion and resolute determination of one man – and his team… against all odds over many years … especially the mega Goliath of destruction of all times: a constant fight for funds … and thus… survival.

World of Birds Homepage

Starting with the World of Birds Homepage, we look at the integration of the following visual elements:

1. Vertical Menu to the left – which changes from the previous Evolution websites I built, eg. for Monkey Valley Resort HERE. Seems I’m into the monkey business :)
2. Logo
3. Full-screen Background Image
4. Slideshow (4)
5. Footer with Copyright Notice.

World of Bird Categories

Next, we need to decide on the Categories for this Website – which depends on its purpose. A client would provide us with these essentials – which are important in terms of keywords.

In our ttest example, we will mainly focus on images; so these will be the ‘World of Birds’ Categories:

1. Home
2. Mission (About)
3. Birds
4. Mammals
5. Reptiles
6. News
7. Contact

More categories – like Blog and Memorabilia can be added, however, as this is sort of a first exercise on the brand-new EVO2 Script, I focus on a few basics just to have – and give – an idea of what ‘could’ be.

I love the first ever Evolution Script… I’m curious to see what EVO2 makes of me … which of course depends on what I can get myself to make out of  ‘it’! It definitely is much more complex, no doubt. No mastery without experience… which comes from doing only – so here we go!

World of Bird Menu

The title “World of Bird Menu” is a bit misleading here, but we do mean the menu that lines up the categories to the left. As said above, categories need some thought, especially as we want to kick out everything that’s superfluous.

Do I need the sound module?

At this stage, I am not yet quite sure if I’ll add some sound, however, I have something specific in mind and I keep this module.
What about Video?

Possibly, I’ll find a video as well… so that’s at the back of my mind. I keep this module as well.
Which Image Galleries?

I am checking out the various image galleries to make up my mind as to whether I want to show big images without any text – like in a Photo Gallery that speaks for itself – or smaller images where I have an opportunity to add text as well. As it makes a lot of sense to present animals with specific descriptives, the ‘services’ gallery makes sense here and I inserted it for “News”.

What’s the Link for?

Ideally, this EVO2 should be linked to a dynamic Blog on Semiomantics XO2011. Just as on the first Evolution Script.

What about a Shop?

‘World of Birds’ has a Curio Shop that offers a wide range of souvenirs and mementos… so obviously a professional WP Best eShop by Semiomantics would be appropriate, especially as PayPal has finally opened its doors in South Africa not too long ago – but this complex is apart and not part of my current excursion right here.

To be continued. . . after Christmas Dinner :)

New Website for YorgoMan

I had to do this for Christmas! YorgoMan was shouting for weeks as he estimated that his website was outdated. In fact it was not all that bad, but when he saw the new XO and the Evo2, he just screamed for it.

Well if this keeps him off Facebook ….

The Concept of the YorgoMan site

The idea was to build a very visual site (these youngsters don’t like to read and write). His Evo2 is entirely media based with photo, video and music galleries.

As the absence of text in the xml files constitutes a handicap for optimization, Evo2 is paired by an XO 2011. Both sites are interlinked whereas on the XO we rotate 3D banners with screen-shots of Evo2 and linking to the corresponding Page on Evo2.

From Evo2 a link leads back to the blog.

The WordPress Menu from XO points exclusively to the corresponding Evo2 pages; in fact, it’s a copy of the Evo2 menu.

The lower section features (for the time being) a 3 column section from the lower front page section of XO 2011. There lead to the 3 latest blog posts.

There is no sidebar, no image gallery and no footer widget activated on the XO. The elimination of the top right and left columns is achieved by entering a large number into the post offset field.

The logo on the top left is from Evo, whereas we have placed it using the WordPress background feature.

As the logo is transparent, we can load most any background alongside to give an even closer feel of identity between XO and Evo2.

Publishing

As I was building the site, I involved YorgoMan who is capable of loading and managing media content on Evo2. The idea is now to post to the blog every time a new media file is added. The posts will need to link to the corresponding page on Evo2. By doing so, our friends at the Flower shop (Google for outsiders) will get a kick and remember that Evo2 exists, is active and a hot website.

Have a look at YorgoMan.com and let me know what you think .

Make it a Merry Christmas too for your Kids! (Sounds like a heck of a lot of work for Boruch – luckily X-mas is not an issue there :-)).

Author: Yorgo Nestoridis, Media Marketing & Publishing, Founder of YORGOO Publishing, YORGOO Press and Semiomantics. If you enjoyed reading the above, please consider following future tips and strategies by RSS reader, Email delivery, or Kindle subscription.

Related posts:

1. Semiomantics Evo2 Images
2. Evo2 Gallery Tutorial
3. Evo 2 Home Page Tutorial
4. Elegant Web Design Evo2
5. How to build your Evo2

Evo2 Screen-shots

You want a more attractive site than many a movie star? You want to create your personal site with more media capabilities than Facebook? The Solution is Semiomantics Evo2 where you have full control over your assets, communication and visibility.

YorgoMan has been busy all afternoon loading files to his new site; here are some images showing the new site:

Semiomantics Evo2 Images

Evo2 can be purchased from Semiomantics; the script comes pre-configured for your needs or custom built depending on your needs and specifications.

Author: Yorgo Nestoridis, Media Marketing & Publishing, Founder of YORGOO Publishing, YORGOO Press and Semiomantics. If you enjoyed reading the above, please consider following future tips and strategies by RSS reader, Email delivery, or Kindle subscription.

Related posts:

1. Elegant Evo2 Web Design
2. Semiomantics Evo 2 Images
3. Elegant Web Design Evo2
4. Elegant Web Design New Evolution by Semiomantics
5. Evo2 Gallery Tutorial

How to create galleries on Evo2

After our last tutorial focusing on the menu, we will have a look at multiple galleries today.

In order to multiply a module, you just need to use your copy and paste capabilities :-).

The above image illustrates the present YorgoMan site. You can see the menu entries representing multiple times the gallery module. This means we have created multiple (4 additional) photo galleries.

Here are the photo albums:

1. Sun and Sea (this one is the original gallery with the images.xml)
2. Basketball
3. Friends
4. Holidays
5. I me and myself

In order to make these albums work, you need to create for each album an image folder. The easiest is to create image folders under evo2/images  with the name of the album, such as basketball, friends …….

Second, you create xml files for each menu item:

basketball.xml, friends.xml,… which you put into the folder evo2/xml. To make life easier, just copy and paste the content of images.xml and adapt accordingly.

Finally you need to make sure that your menu items reflect the new xml files for each new item.

Load images

Now just load your images:

backgrounds into the backgrounds folder under evo2/images; then specify the background for each item in menu.xml.

The Gallery images go into the new folders under evo2/images: I use the defult size of 800 x 600 pixels, however the script adapts automatically to any size and format you load. For best usability and display also on smaller screens, limit the height to 600 px.

For thumbnails, create a sub-folder under each gallery image folder called ‘thumbs’. I use default thumbnail size of 250 x 370 px.

That’s it.

Author: Yorgo Nestoridis, Media Marketing & Publishing, Founder of YORGOO Publishing, YORGOO Press and Semiomantics. If you enjoyed reading the above, please consider following future tips and strategies by RSS reader, Email delivery, or Kindle subscription.

Related posts:

1. Evo2 Menu Tutorial
2. Evo 2 Home Page Tutorial
3. Elegant Web Design Evo2
4. How to build your Evo2
5. Elegant Evo2 Web Design

How to Structure the Evo2 Menu

The Evo2 Menu is as flexible as you need it to be. To adapt the menu to fit your project, decide first which modules you wish to use and then edit the menu in function of the desired structure.

YorgoMan Menu

The YorgoMan site will feature mainly Photos. The preferred gallery module is the Images module. YorgoMan wants to organize the images in albums and for each album he wants to load a menu entry.

Albums:

1. Sun and Sea
2. Basketball
3. Friends
4. Holidays
5. I me and myself

We will need 5 times the Image module.

A further category will be Music where he wants to load his preferred songs; for this we will use the Music Module.

Finally, he wants to load some YouTube clips, for which we use the YouTube Galley module.

For the good order’s sake we keep the contact form and eliminate all other modules.

How to Edit the Menu

The visible part of the menu is edited in evo2/xml/menu.xml

Each menu item is defined by code between <page> …. </page> tags. I delete all items which are not needed from the menu.xml and keep only the home page, Images, YouTube Gallery and Contact. Also I will keep the Links module to point to the YorgoMan Blog.

We will get the following script after this first operation:

<?xml version="1.0" encoding="ISO-8859-1"?>

<data>

	<!-- menuTitle = the title of the menu item -->
	<!-- deepLinkURL = the deep-link url page name -->
	<!-- image "align" = what point to align your background image -->
	<!-- image = the url of your background image -->
	<!-- module "thirdParty = if the swf is your onw and not a module from the template -->
	<!-- module = the module to load in for the page -->
	<!-- moduleType = the type of module to load in.  see below for options -->
	<!-- moduleXML = the url of the module's xml file -->

	<!--

	ACCEPTED PARAMETERS FOR BACKGROUND ALIGN: "bgAlign"

	tl = top-left;
	tc = top-center;
	tr = top-right

	lc = left-center
	mc = middle-center
	rc = right-center

	bl = bottom-left
	bc = bottom-center
	br = bottom-right

	-->

	<!-- BELOW ARE THE ACCEPTED PARAMETERS FOR EACH MODULE FOR THE "modulePos" node

	longText:

	1) "left"
	2) "center"
	3) "right"

	// ****************************

	gallery:

	1) "lc" (left-center)

	// ****************************

	portfolio:

	1) "tc" (top-center)

	// ****************************

	news / services / music:

	1) "lc" (left-center)

	// ****************************

	banner:

	1) "tl" (top-left)
	2) "tc" (top-center)
	3) "tr" (top-right)

	4) "lc" (left-center)
	5) "mc" (middle-center)
	6) "rc" (right-center)

	7) "bl" (bottom-left)
	8) "bc" (bottom-center)
	9) "br" (bottom-right)

	// *****************************

	contact:

	1) "tl" (top-left)
	2) "tc" (top-center)
	3) "tr" (top-right)

	4) "lc" (left-center)
	5) "mc" (middle-center)
	6) "rc" (right-center)

	7) "bl" (bottom-left)
	8) "bc" (bottom-center)
	9) "br" (bottom-right)

	-->

	<!--

	accepted parameters for module type:

	1) customModule
	2) yourSwf

	SPECIAL NOTES:

	// A static image or 3rd party swf can be loaded as a module.
	// If a 3rd party swf is loaded, the moduleXML parameter will be ignored
	// If you wish to not load in a module (for example a menu item that has a sub-menu),
	// write null for all parameters except the "menuTitle"

	// deepLinkURL will be converted to lower-case
	// deepLinkURL will be joined to one string/word...
	// For example: "my photos" would become "myphotos"
	// however, "my_photos" would remain "my_photos"

	-->

	<page>
		<menuTitle>HOME</menuTitle>
		<deepLinkURL>home</deepLinkURL>
		<urlTarget>null</urlTarget>
		<bgURL>images/backgrounds/1.jpg</bgURL>
		<bgAlign>tc</bgAlign>
		<moduleURL>banner.swf</moduleURL>
		<modulePos>mc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/banner.xml</moduleXML>
	</page>

	<page>
		<menuTitle>IMAGES</menuTitle>
		<deepLinkURL>images</deepLinkURL>
		<urlTarget>null</urlTarget>
		<bgURL>images/backgrounds/11.jpg</bgURL>
		<bgAlign>bl</bgAlign>
		<moduleURL>gallery.swf</moduleURL>
		<modulePos>lc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/images.xml</moduleXML>
	</page>

	<page>
		<menuTitle>YOU TUBE GALLERY</menuTitle>
		<deepLinkURL>you tube videos</deepLinkURL>
		<urlTarget>_self</urlTarget>
		<bgURL>images/backgrounds/18.jpg</bgURL>
		<bgAlign>bl</bgAlign>
		<moduleURL>gallery.swf</moduleURL>
		<modulePos>lc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/you_tube.xml</moduleXML>
	</page>

	<page>
		<menuTitle>MUSIC</menuTitle>
		<deepLinkURL>our music</deepLinkURL>
		<urlTarget>_self</urlTarget>
		<bgURL>images/backgrounds/18.jpg</bgURL>
		<bgAlign>tl</bgAlign>
		<moduleURL>music.swf</moduleURL>
		<modulePos>lc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/musicmodule.xml</moduleXML>
	</page>

	<page>
		<menuTitle>LINK</menuTitle>
		<deepLinkURL>http://www.semiomantics.com</deepLinkURL>
		<urlTarget>_blank</urlTarget>
		<bgURL>images/backgrounds/7.jpg</bgURL>
		<bgAlign>tl</bgAlign>
		<moduleURL>contact.swf</moduleURL>
		<modulePos>mc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>null</moduleXML>
	</page>

	<page>
		<menuTitle>CONTACT</menuTitle>
		<deepLinkURL>contact</deepLinkURL>
		<urlTarget>null</urlTarget>
		<bgURL>images/backgrounds/7.jpg</bgURL>
		<bgAlign>tl</bgAlign>
		<moduleURL>contact.swf</moduleURL>
		<modulePos>mc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/contact.xml</moduleXML>
	</page>

</data>

Multiply the Image Galleries

the Following Block defines the Image Gallery:

<page>
		<menuTitle>IMAGES</menuTitle>
		<deepLinkURL>images</deepLinkURL>
		<urlTarget>null</urlTarget>
		<bgURL>images/backgrounds/11.jpg</bgURL>
		<bgAlign>bl</bgAlign>
		<moduleURL>gallery.swf</moduleURL>
		<modulePos>lc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/images.xml</moduleXML>
	</page>

Let’s try to understand these lines:

Line 2: Menu entry Title as it will appear on the site

Line 3: is the link slug – needs to be different for each gallery.

Line 4: Would be an external link target which we don’t need here – we leave the value at ‘null’.

Line 5: Is the relative link to the gallery’s background picture. Can be different for each Gallery: just load background images into the evo2/images/backgrounds folder and then define here the image name you wish to import as gallery background.

Line 6: Is the alignment of the background image, here bl for bottom left.

Line 7: Defines the module we use. This remains unchanged for all Galleries: gallery.swf

Line 8: is the alignment of the module, here lc for left-center. Don’t change this.

Line 9: Don’t change.

Line 10: Each Gallery will need it’s own xml file, since we define there each image.

We will now copy paste this code block 4 times to end up with 5 Galleries.

You end up with the following:

<?xml version="1.0" encoding="ISO-8859-1"?>

<data>

	<!-- menuTitle = the title of the menu item -->
	<!-- deepLinkURL = the deep-link url page name -->
	<!-- image "align" = what point to align your background image -->
	<!-- image = the url of your background image -->
	<!-- module "thirdParty = if the swf is your onw and not a module from the template -->
	<!-- module = the module to load in for the page -->
	<!-- moduleType = the type of module to load in.  see below for options -->
	<!-- moduleXML = the url of the module's xml file -->

	<!--

	ACCEPTED PARAMETERS FOR BACKGROUND ALIGN: "bgAlign"

	tl = top-left;
	tc = top-center;
	tr = top-right

	lc = left-center
	mc = middle-center
	rc = right-center

	bl = bottom-left
	bc = bottom-center
	br = bottom-right

	-->

	<!-- BELOW ARE THE ACCEPTED PARAMETERS FOR EACH MODULE FOR THE "modulePos" node

	longText:

	1) "left"
	2) "center"
	3) "right"

	// ****************************

	gallery:

	1) "lc" (left-center)

	// ****************************

	portfolio:

	1) "tc" (top-center)

	// ****************************

	news / services / music:

	1) "lc" (left-center)

	// ****************************

	banner:

	1) "tl" (top-left)
	2) "tc" (top-center)
	3) "tr" (top-right)

	4) "lc" (left-center)
	5) "mc" (middle-center)
	6) "rc" (right-center)

	7) "bl" (bottom-left)
	8) "bc" (bottom-center)
	9) "br" (bottom-right)

	// *****************************

	contact:

	1) "tl" (top-left)
	2) "tc" (top-center)
	3) "tr" (top-right)

	4) "lc" (left-center)
	5) "mc" (middle-center)
	6) "rc" (right-center)

	7) "bl" (bottom-left)
	8) "bc" (bottom-center)
	9) "br" (bottom-right)

	-->

	<!--

	accepted parameters for module type:

	1) customModule
	2) yourSwf

	SPECIAL NOTES:

	// A static image or 3rd party swf can be loaded as a module.
	// If a 3rd party swf is loaded, the moduleXML parameter will be ignored
	// If you wish to not load in a module (for example a menu item that has a sub-menu),
	// write null for all parameters except the "menuTitle"

	// deepLinkURL will be converted to lower-case
	// deepLinkURL will be joined to one string/word...
	// For example: "my photos" would become "myphotos"
	// however, "my_photos" would remain "my_photos"

	-->

	<page>
		<menuTitle>HOME</menuTitle>
		<deepLinkURL>home</deepLinkURL>
		<urlTarget>null</urlTarget>
		<bgURL>images/backgrounds/1.jpg</bgURL>
		<bgAlign>tc</bgAlign>
		<moduleURL>banner.swf</moduleURL>
		<modulePos>mc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/banner.xml</moduleXML>
	</page>

	<page>
		<menuTitle>IMAGES</menuTitle>
		<deepLinkURL>images</deepLinkURL>
		<urlTarget>null</urlTarget>
		<bgURL>images/backgrounds/11.jpg</bgURL>
		<bgAlign>bl</bgAlign>
		<moduleURL>gallery.swf</moduleURL>
		<modulePos>lc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/images.xml</moduleXML>
	</page>

	<page>
		<menuTitle>IMAGES</menuTitle>
		<deepLinkURL>images</deepLinkURL>
		<urlTarget>null</urlTarget>
		<bgURL>images/backgrounds/11.jpg</bgURL>
		<bgAlign>bl</bgAlign>
		<moduleURL>gallery.swf</moduleURL>
		<modulePos>lc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/images.xml</moduleXML>
	</page>

	<page>
		<menuTitle>IMAGES</menuTitle>
		<deepLinkURL>images</deepLinkURL>
		<urlTarget>null</urlTarget>
		<bgURL>images/backgrounds/11.jpg</bgURL>
		<bgAlign>bl</bgAlign>
		<moduleURL>gallery.swf</moduleURL>
		<modulePos>lc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/images.xml</moduleXML>
	</page>

	<page>
		<menuTitle>IMAGES</menuTitle>
		<deepLinkURL>images</deepLinkURL>
		<urlTarget>null</urlTarget>
		<bgURL>images/backgrounds/11.jpg</bgURL>
		<bgAlign>bl</bgAlign>
		<moduleURL>gallery.swf</moduleURL>
		<modulePos>lc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/images.xml</moduleXML>
	</page>

	<page>
		<menuTitle>IMAGES</menuTitle>
		<deepLinkURL>images</deepLinkURL>
		<urlTarget>null</urlTarget>
		<bgURL>images/backgrounds/11.jpg</bgURL>
		<bgAlign>bl</bgAlign>
		<moduleURL>gallery.swf</moduleURL>
		<modulePos>lc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/images.xml</moduleXML>
	</page>

	<page>
		<menuTitle>YOU TUBE GALLERY</menuTitle>
		<deepLinkURL>you tube videos</deepLinkURL>
		<urlTarget>_self</urlTarget>
		<bgURL>images/backgrounds/18.jpg</bgURL>
		<bgAlign>bl</bgAlign>
		<moduleURL>gallery.swf</moduleURL>
		<modulePos>lc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/you_tube.xml</moduleXML>
	</page>

	<page>
		<menuTitle>MUSIC</menuTitle>
		<deepLinkURL>our music</deepLinkURL>
		<urlTarget>_self</urlTarget>
		<bgURL>images/backgrounds/18.jpg</bgURL>
		<bgAlign>tl</bgAlign>
		<moduleURL>music.swf</moduleURL>
		<modulePos>lc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/musicmodule.xml</moduleXML>
	</page>

	<page>
		<menuTitle>LINK</menuTitle>
		<deepLinkURL>http://www.semiomantics.com</deepLinkURL>
		<urlTarget>_blank</urlTarget>
		<bgURL>images/backgrounds/7.jpg</bgURL>
		<bgAlign>tl</bgAlign>
		<moduleURL>contact.swf</moduleURL>
		<modulePos>mc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>null</moduleXML>
	</page>

	<page>
		<menuTitle>CONTACT</menuTitle>
		<deepLinkURL>contact</deepLinkURL>
		<urlTarget>null</urlTarget>
		<bgURL>images/backgrounds/7.jpg</bgURL>
		<bgAlign>tl</bgAlign>
		<moduleURL>contact.swf</moduleURL>
		<modulePos>mc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/contact.xml</moduleXML>
	</page>

</data>

Now we need to

Customize the Galleries

As we saw above, there are a certain number of entries specific to each gallery:

Let’s start with the apparent Menu entries:

in each gallery code block we change the Menu Title to fit the project.

in each gallery code block we change the deep link url (i.e. the slug)

in each gallery code block we change the background image (we will need to load these backgrounds to evo2/images/backgrounds)

in each gallery code block we change the name of the xml file to images1.xml, images2.xml …. we will then have to create these files in evo2/xml by simply copying the images.xml multiple times and renaming it.

You get the following menu.xml

<?xml version="1.0" encoding="ISO-8859-1"?>

<data>

	<!-- menuTitle = the title of the menu item -->
	<!-- deepLinkURL = the deep-link url page name -->
	<!-- image "align" = what point to align your background image -->
	<!-- image = the url of your background image -->
	<!-- module "thirdParty = if the swf is your onw and not a module from the template -->
	<!-- module = the module to load in for the page -->
	<!-- moduleType = the type of module to load in.  see below for options -->
	<!-- moduleXML = the url of the module's xml file -->

	<!--

	ACCEPTED PARAMETERS FOR BACKGROUND ALIGN: "bgAlign"

	tl = top-left;
	tc = top-center;
	tr = top-right

	lc = left-center
	mc = middle-center
	rc = right-center

	bl = bottom-left
	bc = bottom-center
	br = bottom-right

	-->

	<!-- BELOW ARE THE ACCEPTED PARAMETERS FOR EACH MODULE FOR THE "modulePos" node

	longText:

	1) "left"
	2) "center"
	3) "right"

	// ****************************

	gallery:

	1) "lc" (left-center)

	// ****************************

	portfolio:

	1) "tc" (top-center)

	// ****************************

	news / services / music:

	1) "lc" (left-center)

	// ****************************

	banner:

	1) "tl" (top-left)
	2) "tc" (top-center)
	3) "tr" (top-right)

	4) "lc" (left-center)
	5) "mc" (middle-center)
	6) "rc" (right-center)

	7) "bl" (bottom-left)
	8) "bc" (bottom-center)
	9) "br" (bottom-right)

	// *****************************

	contact:

	1) "tl" (top-left)
	2) "tc" (top-center)
	3) "tr" (top-right)

	4) "lc" (left-center)
	5) "mc" (middle-center)
	6) "rc" (right-center)

	7) "bl" (bottom-left)
	8) "bc" (bottom-center)
	9) "br" (bottom-right)

	-->

	<!--

	accepted parameters for module type:

	1) customModule
	2) yourSwf

	SPECIAL NOTES:

	// A static image or 3rd party swf can be loaded as a module.
	// If a 3rd party swf is loaded, the moduleXML parameter will be ignored
	// If you wish to not load in a module (for example a menu item that has a sub-menu),
	// write null for all parameters except the "menuTitle"

	// deepLinkURL will be converted to lower-case
	// deepLinkURL will be joined to one string/word...
	// For example: "my photos" would become "myphotos"
	// however, "my_photos" would remain "my_photos"

	-->

	<page>
		<menuTitle>HOME</menuTitle>
		<deepLinkURL>home</deepLinkURL>
		<urlTarget>null</urlTarget>
		<bgURL>images/backgrounds/1.jpg</bgURL>
		<bgAlign>tc</bgAlign>
		<moduleURL>banner.swf</moduleURL>
		<modulePos>mc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/banner.xml</moduleXML>
	</page>

	<page>
		<menuTitle>SUN & SEA</menuTitle>
		<deepLinkURL>sunsea</deepLinkURL>
		<urlTarget>null</urlTarget>
		<bgURL>images/backgrounds/11.jpg</bgURL>
		<bgAlign>bl</bgAlign>
		<moduleURL>gallery.swf</moduleURL>
		<modulePos>lc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/images.xml</moduleXML>
	</page>

	<page>
		<menuTitle>BASKETBALL</menuTitle>
		<deepLinkURL>basketball</deepLinkURL>
		<urlTarget>null</urlTarget>
		<bgURL>images/backgrounds/12.jpg</bgURL>
		<bgAlign>bl</bgAlign>
		<moduleURL>gallery.swf</moduleURL>
		<modulePos>lc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/images1.xml</moduleXML>
	</page>

	<page>
		<menuTitle>FRIENDS</menuTitle>
		<deepLinkURL>friends</deepLinkURL>
		<urlTarget>null</urlTarget>
		<bgURL>images/backgrounds/11.jpg</bgURL>
		<bgAlign>bl</bgAlign>
		<moduleURL>gallery.swf</moduleURL>
		<modulePos>lc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/images2.xml</moduleXML>
	</page>

	<page>
		<menuTitle>HOLYDAYS</menuTitle>
		<deepLinkURL>holidays</deepLinkURL>
		<urlTarget>null</urlTarget>
		<bgURL>images/backgrounds/13.jpg</bgURL>
		<bgAlign>bl</bgAlign>
		<moduleURL>gallery.swf</moduleURL>
		<modulePos>lc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/images3.xml</moduleXML>
	</page>

	<page>
		<menuTitle>I ME & MYSELF</menuTitle>
		<deepLinkURL>yorgo</deepLinkURL>
		<urlTarget>null</urlTarget>
		<bgURL>images/backgrounds/14.jpg</bgURL>
		<bgAlign>bl</bgAlign>
		<moduleURL>gallery.swf</moduleURL>
		<modulePos>lc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/images4.xml</moduleXML>
	</page>

	<page>
		<menuTitle>YOU TUBE GALLERY</menuTitle>
		<deepLinkURL>you tube videos</deepLinkURL>
		<urlTarget>_self</urlTarget>
		<bgURL>images/backgrounds/18.jpg</bgURL>
		<bgAlign>bl</bgAlign>
		<moduleURL>gallery.swf</moduleURL>
		<modulePos>lc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/you_tube.xml</moduleXML>
	</page>

	<page>
		<menuTitle>MUSIC</menuTitle>
		<deepLinkURL>our music</deepLinkURL>
		<urlTarget>_self</urlTarget>
		<bgURL>images/backgrounds/18.jpg</bgURL>
		<bgAlign>tl</bgAlign>
		<moduleURL>music.swf</moduleURL>
		<modulePos>lc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/musicmodule.xml</moduleXML>
	</page>

	<page>
		<menuTitle>LINK</menuTitle>
		<deepLinkURL>http://www.semiomantics.com</deepLinkURL>
		<urlTarget>_blank</urlTarget>
		<bgURL>images/backgrounds/7.jpg</bgURL>
		<bgAlign>tl</bgAlign>
		<moduleURL>contact.swf</moduleURL>
		<modulePos>mc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>null</moduleXML>
	</page>

	<page>
		<menuTitle>CONTACT</menuTitle>
		<deepLinkURL>contact</deepLinkURL>
		<urlTarget>null</urlTarget>
		<bgURL>images/backgrounds/7.jpg</bgURL>
		<bgAlign>tl</bgAlign>
		<moduleURL>contact.swf</moduleURL>
		<modulePos>mc</modulePos>
		<moduleType>customModule</moduleType>
		<moduleXML>xml/contact.xml</moduleXML>
	</page>

</data>

Now our menu is set at least in as much as the Galleries are concerned.

Look out for the next post about How to Edit and populate the Galleries.

Author: Yorgo Nestoridis, Media Marketing & Publishing, Founder of YORGOO Publishing, YORGOO Press and Semiomantics. If you enjoyed reading the above, please consider following future tips and strategies by RSS reader, Email delivery, or Kindle subscription.

Related posts:

1. Elegant Web Design Evo2
2. Elegant Evo2 Web Design
3. Evo 2 Home Page Tutorial
4. How to build your Evo2
5. Elegant Evo2 Web Design

Evo2 Tutorial: Build your Home Page

This tutorial will explain how to populate your Evo2 Home page. But before we start we need to define the concept and project.

The Evo2 Project

For the purpose of this Tutorial we will build an Evo2 reviewing 2010 from the point of view of YorgoMan, my son that is. Youngsters are not easy ‘customers’, namely when it comes to matters of design, style and look.

The Content

The content will consist mainly of images, photos and a few video clips tracing the main events of the year.

The Evo2 Home Page

The Evo2 Home Page consists of the folowing elements:

1. Menu
2. Logo
3. Background
4. Slide-show
5. Footer

Tasks

Download Evo2 and unzip it into a new folder on your hard drive, in my case …yorgoman/2010

1. Create a Logo

Default size is: 171 x 97 pixels. I prefer 177 x 156 pixels. I use Photoshop to take out the background of a photo and re-size it, save as transparent .png image and  call it yorgoman.png.

Load the image to evo2/images.

1. Edit evo2/xml/config.xml

Line 4: put your site title

Line 21: change image name to: images/yorgoman.png

Line 24: x-position: 65

Line 27: y-pisition 0. (x and y-positions depend on the image size).

Line 171: Enter copyright notice (the copyright sign Alt+0169 from the numbers keyboard)

Save config.xml

2. Load a background

I took a photograph YorgoMan chose and re-sized it to 1900 x 1425 px

Since I replaced the standard logo with an image, I add the title YorgoMan to the background image.

Name the background image 1.jpg and load into the folder evo2/images/backgrounds.

3. Edit the Menu

Edit evo2/xml/menu.xml:

Line 124: let background align value to tc (top center) as I want to make sute the title is properly positioned on any screen.

Save the file.

4. Populate the banner rotator:

Load 4 images to evo2/images/banner

Image size: 720 x 400 px (you can change the size but you would then also need to change the corresponding size in banner.xml)

Name the images: img1.jpg, img2.jpg ….

Edit evo2/xml/banner.xml:

Lines 8 and 11: change here if you chose a different image size. As the case may be change banner behavior: the script is self explanatory as with the first image properties you have all comments needed.

Save banner.xml

Note: you can add more images to the rotator: in this case, just copy pasteadd more items to banner.xml by copying multiple times <item> …</item>.

Author: Yorgo Nestoridis, Media Marketing & Publishing, Founder of YORGOO Publishing, YORGOO Press and Semiomantics. If you enjoyed reading the above, please consider following future tips and strategies by RSS reader, Email delivery, or Kindle subscription.

Related posts:

1. WP Best Business Theme Home Page
2. How to build your Evo2
3. Thesis Tutorial Header Banner Rotator
4. Thesis Tutorial Feature Box
5. Glossy WordPress Theme Development

Step by Step Guide to Evo2

Ycademy’s Evo2 Seminar covered all modules of Evo2, however there was not enough time to practically exercise during Workshops. For this reason we will publish here a step by step guide about how to realize an Evo2 project.

The Evo2 Tutorial or Guide

There will be a tutorial per module used to realize a simple project. In order to follow the Guide you will need to have access to an Evo2 script as well as to a tool to re-size and crop images. Finally you will need to dispose of some media, images and eventually videos.

We recommend to use Photoshop where available or Pain which is a free tool coming with Windows.

The Project

For the purpose of this tutorial we will implement a simple project called YorgoMan 2010, which will highlight YorgoMan’s year. In as much as I am concerned, I will use Photoshop to edit images, however paint will do as well.

Look out for Step 1: The Home Page.

Author: Yorgo Nestoridis, Media Marketing & Publishing, Founder of YORGOO Publishing, YORGOO Press and Semiomantics. If you enjoyed reading the above, please consider following future tips and strategies by RSS reader, Email delivery, or Kindle subscription.

Related posts:

1. Elegant Web Design Evo2
2. Elegant Evo2 Web Design
3. Elegant Evo2 Web Design
4. Build your Flash Website Step 2
5. Glossy WordPress Theme Development

A sneak-preview of Evo 2

Later today, Ycademy Seminar participants will build their own Evo2 based on the default as per Evo 2 Images here below:

Author: Yorgo Nestoridis, Media Marketing & Publishing, Founder of YORGOO Publishing, YORGOO Press and Semiomantics. If you enjoyed reading the above, please consider following future tips and strategies by RSS reader, Email delivery, or Kindle subscription.

Related posts:

1. Bold WordPress tuned by Semiomantics
2. Flash Components by Semiomantics
3. Elegant Web Design New Evolution by Semiomantics
4. Semiomantics Evolution Combo
5. Elegant Web Design

XO and Evo2 for WordPress

May be  it was a crazy idea to unite Semiomantics XO 2011 for WordPress and Evo 2 in a one day seminar. But then: all registered seminar participants have gained the necessary bases at previous Ycademy trainings and if we look at it closely we notice: it’s all stuff we know and we have been playing with, just not with the virtuosity we will be developing at tomorrow’s last major event of the year.

XO is like a basic Lego For WordPress

XO 2011 for WordPress is like a basic Lego for WordPress, since it is built for quick basic customization, fast loading and extraordinary performance. If basic customization is not enough, then your creativity is the limit.

XO 2011 can host and integrate most any web component be it media, flash, frames, you name it. Based on our design experience with Thesis and then with XO 2011 where we have been working namely with Flash components, we should be capable to assimilate the smashing combination of XO 2011 and Evo2.

What is Evo2 anyway

Basically Evo2 is a flash website which has been modified for our purposes. A flash websoite is not much else than a Flash framework which holds multiple flash components. So, in stead of dealing with just one orphan component, we will deal with 15 components!

Best of all, all these components can be integrated into the XO Framework.

What is the result?

The goal of the seminar is to learn how to use Evo2 and how to integrate it’s components into XO 2011.

In one day we can apprehend the basics and do some exercises during the Workshops. You will see, that there is hardly any limit and once your creativity unleashed and translated into XO Evo2, the result will be the best performing and most smashing websites for your customers.

What you need for the Seminar

Most of the work involved with Evo2 is cropping of images. The best base to build your sample site are 10-12 full size photos, which we will then re-size as needed.

Author: Yorgo Nestoridis, Media Marketing & Publishing, Founder of YORGOO Publishing, YORGOO Press and Semiomantics. If you enjoyed reading the above, please consider following future tips and strategies by RSS reader, Email delivery, or Kindle subscription.

Related posts:

1. Ycademy Flash Seminar May 29-30, 2010
2. Ycademy November Seminar
3. Ycademy Online Seminar
4. Flash Components by Semiomantics
5. Semiomantics XO 2011 for WordPress

New Horizon for Elegant WordPress Themes

Semiomantics innovative WordPress based website developments have explored a new level: a Glossy Elegant WordPress Theme based on the combination of the Semiomantics tuned Thesis Theme with Semiomantics Evolution Flash developments.

The Idea behind the Project

Semiomantics first priority in developing WordPress has always been the performance and SEO of the sites. Media and media related semantics are less efficient on Google than text; therefore Semiomantics has focused for media development outside WordPress, namely in connection with Flash developments.

Customers and visitors of Semiomantics Evolution sites are amazed by the quality of the media, display and effects. While flash offers the most stunning visual effects, their semantics is less SE efficient than traditional html.

The idea was now to associate the flash developments with the WordPress developments and to use flash media to shape the look of WordPress. Inversely, one could imagine to import WordPress content into Flash environments.

At the bases of the development there is always a Semiomantics WordPress script.

The Purpose of the Project

Traditionally, commercial customers have to choose between a smashing flash website, a SE efficient HTML site or some sort of a compromise of both. Compromises are rarely satisfactory, that’s why people often use two sites and interlink them.

The purpose of the project was therefore to associate the advantages of both extremes under one Semiomantics WordPress CMS to let visitors of the High Performance Semiomantics WP experience the smashing media delivered by Semiomantics Evolution.

Implementation and Screenshots

The test run this past week-end was run on this website in combination with Semiomantics Evolution and EVO2.

A first shot was to integrate Evolution right below the header banner of the WordPress site. As the image results from a heavily zoomed out screen, the full width of EVO2 is not displayed on the screen shot. In reality we see the whole display of EVO2. Also the Logo on EVO2 moves down to the menu, just because of the Zoom effect:

The second shot was to display only EVO2 on the Home Page, giving the site a look of a glossy magazine. This screen is not zoomed and displays the content correctly.

Here it is where things get interesting: the menu in EVO2 can serve as a WordPress Navigation and inversely, the WordPress Navigation can be associated with the menu of EVO2. Here is how it works:

If on the EVO2 menu we select ‘HOME’ we are directed to the home page of the blog, there we would see the Homepage content of WordPress as well as the corresponding Media from EVO2. The same applies to every category of page. Further development would be needed to create associations to posts with custom media.

The EVO2 Navigation would allow to select categories for example and the WordPress navigation could display menus featuring the contained posts and related media.

In the end, EVO2 can serve as a fully integrated multimedia box for WordPress based websites!

Author: Yorgo Nestoridis, Media Marketing & Publishing, Founder of YORGOO Publishing, YORGOO Press and Semiomantics. If you enjoyed reading the above, please consider following future tips and strategies by RSS reader, Email delivery, or Kindle subscription.

Related posts:

1. Elegant WordPress by Semiomantics 101
2. WordPress Themes and Development
3. Elegant Web Design New Evolution by Semiomantics
4. WordPress 3.0 and Semiomantics
5. Semiomantics Evolution Combo

Milestone in Photo Web Design

Evo2 by Semiomantics sets new Standards

Evo2 by Semiomantics is what I would call the ideal script to present photos, images of all kinds, videos, audios, in short all kinds of media in the most generous and astonishing way. The beauty of the web design is just one asset; what’s under the hood of this high profile script is the most advanced semantic publishing optimization Semiomantics has come up with as per today.

Semiomantics Evo2 will be released in early September and extensively commented. Look forward to it and get prepared for a new way to present Media online!

Semiomantics Evolution the Top Classic

My classic favorite remains Semiomantics Evolution. Recently we have seen some exciting developments by smart designers and it will be a pleasure to present an Evolution gallery in the near future.

Copyright © 2010 Photo Media Stock Top Photo Website Design is a post from: Photo Media Stock

New Elegant Web Design Evo2 Page

Time permitting the development of Evo2 continues. Yesterday’s Photos serve as the base for yet another smashing Evo2 Page:

screen12

Semiomantics Evo2 Mixed Media Content Page

The page holds mixed media: images and video.

Enjoy and look forward to the final release by end of June.

Author: Yorgo Nestoridis, Media Marketing & Publishing, Founder of YORGOO Publishing, YORGOO Press and Semiomantics. If you enjoyed reading the above, please consider following future tips and strategies by RSS reader, Email delivery, or Kindle subscription.

Elegant Web Design with Evo2

Some more screen-shots from the Evo2 development desk: a News or Product Page.

screen11

Evo2 News Page wide screen

screen10

Evo2 News Page

Author: Yorgo Nestoridis, Media Marketing & Publishing, Founder of YORGOO Publishing, YORGOO Press and Semiomantics. If you enjoyed reading the above, please consider following future tips and strategies by RSS reader, Email delivery, or Kindle subscription.

Elegant Web Design by Semiomantics

Here is one more screen-shot of the elegant Evo2. The page could be  used to present services or products.

screen8

Elegant Web design by Semiomantics

A click on the product images expand the featured text. The site is in Flash Design.

Look forward to the next feature which will be available tomorrow.

Author: Yorgo Nestoridis, Media Marketing & Publishing, Founder of YORGOO Publishing, YORGOO Press and Semiomantics. If you enjoyed reading the above, please consider following future tips and strategies by RSS reader, Email delivery, or Kindle subscription.

Elegant Web Design

Evo2 by Semiomantics stands for the ultimate in Elegant Web Design!

Here is another sneak preview of Evo2, today the About page and how it can be edited.

screen7

Elegant Web Design

Evo2 for elegant Web Design will be released later this month.

Author: Yorgo Nestoridis, Media Marketing & Publishing, Founder of YORGOO Publishing, YORGOO Press and Semiomantics. If you enjoyed reading the above, please consider following future tips and strategies by RSS reader, Email delivery, or Kindle subscription.

Elegant Web Design with Evo2

After the release of Semiomantics Evolution in March 2010, a new Elegant Web Design framework will be released this week. Evo2 is the most advanced and flexible elegant flash design solution tuned by Semiomantics.

I will present Evo2 feature by feature in a new series of posts about Elegant Web design. So much already today: Evo2 is an exciting  journey into elegant and media focused web design.

Semiomantics Evo2 Preview

Here some first screen-shots of the new flash framework:

semiomantics_evo2

Semiomantics Evo2

screen2

Semiomantics Evo2 wide screen

screen4

Semiomantics Evo 2 BW

screen3

Semiomantics Evo 2 BW wide screen

screen5

Semiomantics Evo2 Gallery

screen6

Semiomantics Evo2 Gallery wide screen

I hope you like this new development; your comments are appreciated :-).

Author: Yorgo Nestoridis, Media Marketing & Publishing, Founder of YORGOO Publishing, YORGOO Press and Semiomantics. If you enjoyed reading the above, please consider following future tips and strategies by RSS reader, Email delivery, or Kindle subscription.