Outsourcing software development is one of the logical decisions for many companies. The key point is finding reliable offshore vendor to work with. Being an experienced company in outsourcing software development, Belitsoft guarantees effective collaboration.
Getcomponent is professional asp .net component development vendor GetComponent is a new ASP .NET component development vendor brand specializing in design and development of user interface (UI) and data visualization application for the Microsoft ASP.NET platform. ASP .NET component development is something we know everything about and we are ready to share this knowledge with our customers.
Web parts for SharePoint
Cool website design
Learning Management System

Joomla extensions, Joomla components, Joomla modules, Joomla software

 
   
 
  
You currently
have 0 item(s)

in your shopping cart.

Joomla Drag&Drop 2 Component

For Joomla 1.0.x
Ready to download!

Image

The newest version of our joomla Drag&Drop component released!


FEATURES

In the second version you also get:

  • ability to minimize/delete/add a module to a page
  • all the changes are saved in cookies which means that they are shown individually for each user
  • you can restore the deleted module with the help of a special menu
  • you can reset modules to the default positions
  • button "Tell a friend" which sends a link of this module to your friend; if your friend uses this link the module will be added to his pages
  • module's control menu is shown when the mouse cursor points on the module

What are the differences with joomla Drag and Drop first version?

  • now you can set only one module per position and you can't move groups of modules as it used to be
  • you can set an icon for each module in the title now
  • transparency feature is used to drag modules
  • modules have a margin which can be turned off now – read the FAQ if you want to learn how to do this
  • when you drag a module the component shows the positions where you can put it
  • improved interface which helps to insert new modules positions much easier
  • you can make a module preview available for users when they try to add the module

You can upgrade from Drag&Drop 1 to Drag&Drop 2 for 30$ using license update service.

Feel free to browse the support forum. If you have more questions get a reply from our technicians.

DEMO

Now it is much simplier to manage your modules from the back-end of this joomla drag n drop component!

  • The hardest part of the configuration is to understand which part of your template should be changed. Check the FAQ addon tab to learn how to do that.
  • We recommend you to create an additional template to have the same template assigned with static pages of your site. To do this you should just create a copy of the existing template at your FTP.
  • After the template is modified go to Components->JoomDrag&Drop->Modules Drag&Drop and create a list of modules which will be shown on your site by default. You should select the existing modules which should be shown at your site's front-end. You can add the module "unpublished" by default – then the user will be able to add the module by himself.
  • When this is done you should go to "List Drag&Drop" option. As we suppose this is your first installation of the component, you should press the "New" button here. Enter the name of this Drag&Drop configuration and go to the "Structure" Tab. Here you should create a table which defines positions for modules at the front-end of your site. You should also select the modules and their positions by default while creating the table. Use Drop-down menus for this purpose.
  • Then go to the "Options" tab. Here you should select the sizes of columns of your table in percents. By default it is set to equal values.
    BE CAREFUL: When you change the number of columns of your table (in the "Structure" Tab) you should re-enter the sizes of columns here!

Feel free to play with the DEMO.

Note: Due to security reason some component doesn't have full functionality there
          Demo site resets every 3 hours.

F.A.Q.

Why the Drag&Drop modules are not displayed on the page after I have opened the menu item (although a drag&drop was assigned to this menu item in the MenuManager)?

It’s possible that you haven’t assigned a specific template that will launch the display of drag&drop modules.

Why the Drag&Drop modules are not displayed on the page after I have opened the menu item (although a specific template was assigned to this menu item)?

It's possible you haven’t selected the drag&drop which should be displayed on this link. Go to the MenuManager and do that.

Why in the drop-down list on the MenuManager page none of the drag&drop items is displayed (the only inscription is "–Select drag&drop-")?

This means that you don’t have any published drag&drop items. Go to the List Drag&Drop and publish the necessary drag&drop items.

How can I add the positions to the matrix when I choose the Structure tab on the List Drag&Drop page?

You’ll see two pluses. By clicking on the upper a column will be created. By clicking on the lower a row will be created. The position will be displayed as soon as the column and the row will cross.

After I have created and saved the module positions, the columns displayed at the frontend don’t have the width I wanted.

This can be set once the structure is saved. On the tab Options you’ll see the field for Size DIV Column # (the numbering starts from the left). Here you can set the width of each column that contains a block. It can be set either in pixels or in percentage of the block’s output area width.

The icon image is not displayed after is has been saved in the Drag&Drop item.

It is possible that you didn't set copywrite on the folder where the images are relocated. Set the attributes 0777 on the folder "images/joomdragdrop_images/".

How can I change the color of modules' edging?

It's necessary to edit the images with the help of which the edging is created. They are located in the following folder (/components/com_joomdragdrop/images) and have the following names: box-bl.gif, box-br.gif, box-tl.gif, box-tl.gif. It's not allowed to change the files' names and extensions.

Some modules show and some don't although all are published. In most of the cases bar a few they are blank. Why is that?

Modules that you are using in the component should be published for a page (Pages/Items in the module's edit page) where the component is output.

I find that none of the tab navigation exists i.e there is no send to a friend, delete nor minimise. Nor can i drag nor drop!! If I make the structure 2 rows by one column then this comes back. Why is this?

Our component conflicts with mootools. It's better to unpublish its modules, and you can just show them on other pages where our component won't be used. As an alternative, you can also publish that module in a different part of the template (and not as a drag and drop module) then it co-exists on the same page as the drag and drop component.

How do you change the CSS?

You can change the css at: http://yoursite.com/components/com_joomdragdrop/style.css

F.A.Q. addon

The most widespread slicing for Joomla templates is performed in two ways.

Let’s examine two variants here:

when a template is sliced with divs

<div>
        <div>  
                <div>
                        content
                <div>
        </div>
</div>

when a template is sliced with tables

<table>
        <tr>
                <td>
                        Content
                </td>
        </tr>
</table>
 

All that is situated between <div></div> represents a block. It can include constructions of various difficulties from other ‘divs’ to tables. The main thing is to detect correctly where the div begins and closes. The slicing process comprises strict elements hierarchy. Every div can be inserted into another one and so on.

Tables are organized in the following way.  A table comprises lines, lines are parted with cells.

<table> - means that a table started.
<tr> - means that a line started.
<td> - means that a cell started.
Text –  cell’s content.
</td> - means that a cell ended.
</tr> - means that a line ended.
</table> - means that a table ended.
 

There can be placed any number of lines into the table.

There can be placed any number of cells into the line.

Thus you reach the necessary dimensionality of the table.

 

We will provide an example of a table of two lines and three columns.

<table>
                <tr>
                                <td>
                                                Content
                                </td>
                                <td>
                                                Content
                                </td>
                                <td>
                                                Content
                                </td>
                </tr>
                <tr>
                                <td>
                                                Content
                                </td>
                                <td>
                                                Content
                                </td>
                                <td>
                                                Content
                                </td>
                </tr>
</table>
 
What we’ll get will be the following table:
Content
Content
Content
Content
Content
Content
 

In order to insert correctly a line of component’s integration into the template it’s necessary to delete blocks (divs or tables) with the maximum nesting gradually until you get the required result that the area where you want to output the component is empty. Here is an example:

 
<div>
<div>
<table>
                <tr>
                                <td>
                                                Content
                                </td>
                                <td>
                                                Content
                                </td>
                                <td>
                                                Content
                                </td>
                </tr>
                <tr>
                                <td>
                                                Content
                                </td>
                                <td>
                                                Content
                                </td>
                                <td>
                                                Content
                                </td>
                </tr>
</table>
</div>
<div>
<table> We’re deleting this table.
                <tr>
                                <td>
                                                Content
                                </td>
                                <td>
                                                Content
                                </td>
                                <td>
                                                Content
                                </td>
                </tr>
                <tr>
                                <td>
                                                Content
                                </td>
                                <td>
                                                Content
                                </td>
                                <td>
                                                Content
                                </td>
                </tr>
</table>
</div>
</div>
Content
Content
Content
Content
Content
Content
Content
Content
Content
Content
Content
Content
 
 
We’ll get:
<div>
<div>
<table>
                <tr>
                                <td>
                                                Content
                                </td>
                                <td>
                                                Content
                                </td>
                                <td>
                                                Content
                                </td>
                </tr>
                <tr>
                                <td>
                                                Content
                                </td>
                                <td>
                                                Content
                                </td>
                                <td>
                                                Content
                                </td>
                </tr>
</table>
</div>
<div>

<?php require_once ("$mosConfig_absolute_path/components/com_joomdragdrop/joomdragdrop.php"); global $option, $Itemid; dragdrop_view($option, $Itemid); ?>

</div>
</div>
We’ll get:
 
Content
Content
Content
Content
Content
Content
The component’s  JoomDrag&Drop output is here.
 
 
 

In order to understand which div or td tag (in case of slicing the template using the tables) should exactly be changed, we suggest using the Firefox browser and a its free add-on FireBug:

After you launch this add-on open your site’s page and click the green icon in the right bottom corner of the browser to start the add-on.

Further you need to click the Inspect button in the add-on and pointing your mouse over the site’s page find and select with the mouse click the area where you are going to activate modules dragging with the help of our component.

Then, in the back-end of your Joomla site you need to open the HTML code of the template being used and find the tag which was defined with FireBug. This tag’s content (this can be either div or td tag) should be replaced with the following:

<?php require_once ("$mosConfig_absolute_path/components/com_joomdragdrop/joomdragdrop.php"); global $option, $Itemid; dragdrop_view($option, $Itemid); ?>

 

Be careful! You shouldn’t delete the tag itself – you need to replace the content between <div> and </div> or <td> and </td> tags!

 
The price is 99 dollars
 
JoomlaLMS
Buy joomla components and get discount on next purchase

Testimonials

Subscriptions Deluxe
Dear Support, I’ve been testing the solution and I’ll say one thing: Wow! It’s everything I wanted and suits the organization perfectly. You’ve made me look like a champion to my clients because t...
C. McAllister