Do It Yourslef Content Management System is a feature-rich, php-built, mysql-based, opensource and free CMS. It is suitable to manage any kind of contents.
It is modular, extensible and easliy skinnable. Build your own modules for specific purposes, add certain functionalites to suit your needs and design a theme that represents the content of your website.
Hi
Today I present you with the video module. It enables users to add videos to your website. Users can add videos either by uploading files from their computers or adding the embed link using any of the video sharing websites.
Module features:
- Unlimited categories and subcategories.
- Multiple video upload at the same time.
- Set video types allowed for upload
- Using group settings you can set the size of video uploaded
- and many more.
This plugin will add a WYSIWYG (what you see is what you get) editor or a visual html editor. It replaces the tinymce editor (the defualt editor for DiY-CMS) with the CKEditor with many options.
Here is the editor image in action with Standard type selected:
First to install the plugin you need to upload the folder to the plugins directory in DiY-CMS root folder. Then you can install it from the admin area by going to plugins sections and then click on the install icon.
Second you may modifey the plugin settings as you need.
You can modifey the skin, the toolbar type, the toolbar location and many more.
Hi
Couple of weeks I started planning to program three modules for DiY-CMS which I thought are necessary for the completion of the CMS. They are gallery, audio and video modules.
Here is the first one, the gallery module. To download it Click Here.
Features:
- Unlimited categories and subcategories.
- Multiple images upload at the same time.
- Three types of listing: Title & photo, Photo Only or Title only.
- Add Copyright text
- Customise copyright colour and position.
- and many more.
Here is the image of the image listing in a category with photo and title type:
and this is the screenshot for viewing a single photo:
If you have not made the switch from the table-design to the tables design, you should now. Even tough that table-less design seems hard to learn, particularly to those who are used to the tabular design it comes with many benefits. The first and the foremost benefit is the great control over the different parts of the website layout. Add to the that most search engines now (i.e Google :) ) favours websites with table-less layout since table layout is considered to be tabular data.
There are two layouts that are used commonly across website “the two columns” (figure 1) and “the three columns” (figure 2) layout. That is the content in the middle and menus on the sides.
Figure 1
Figure 2
The problem:
This layout, when using a table-less layout, comes with a downfall. If the contents container in the middle extends to be more than the side menus bars, the container of the side menus will not extend to the height of the contents. This will affect the appearance of the website. (figure 3)
Figure 3
The first solution that comes to one’s mind is to set the side menus bar’s height to be div {height: 100%}. Nonetheless, this solution is not sufficient since the div container does not have any thing to factor the height. To come over this issue you have to set all the parent containers to 100%.
Another solution is to use Faux Columns. In short this technique sets a background that extends over the contents container and the side menus bars (the author used an example of one side layout, but the concept can be applied to two sides) and then the background is repeated vertically. So the side menu bars will “appear” to be extending down the entire page while in fact it is the background of the contents container.
Even thought this method provides a nice cheat to the issue of div height it limits the designer with the options that he would have in terms of side menus container’s width and background repetition.
The solution:
An extra efficient solution exists, no matter how desperate is the problem. Using div position and stack order one can easily design a website layout that contains extendable side menus bars.
First we set up the layout with the style sheet:
Click here to see the layout in example 1.
To make the background stretches vertically to be as high as the longest div container we will create a duplicate of the div containers that we want to extend (with few changes) and their relevant CSS selectors (I will create one for each menu bar in this tutorial, but you can create a duplicate for any container you like).
I will add these selectors to the page head with simple change:
And I will also add these two divs to the page body and within the main-container div:
You probably noticed that in example 2, the div containers that I have created are not extended within the parent div container. To solve this we add:
position: relative;
to the main-container selector. This will tell the browser to extend the new div containers within the main-container div.
Click here to see the new created containers in example 3.
In example 3 we notice that the new div we create are places over the original side menu bars. This were stack order comes in handy. Using z-index propriety we can "order" the div containers stack that we have. The larger the number is the higher the div is. Please note that z-index propriety will not work with "position: static" which is the default positioning of any div container, so we will change the position of the original side menu containers to "relative" in order for them to be ordered correctly.
By:
admin 
Date Added:
Wednesday 28-07-2010
