Forums

Columns

Permalink
Hello!
I wanna create a web page, where staying pictures in 8 columns, 30 rows. Every spaces are fixed. Every picture is a link. Not the picture sizes are fix! The spaces size is fix, and the pictures is dress /zoom out or in/ I need every picture same size.
Resize the pictures is not good /I know it easy, but if I resize, I dont need concrete5/
I try to create layout /8 columns and 30 rows/ , but the image not dress.
How can I made it?
Sorry my english is not to good!
Thank you very much!
 
cannonf700 replied on at Permalink Reply
cannonf700
Are you trying to make an image gallery or are each of your images linking to a separate page?

For Image Galleries try these:
http://www.concrete5.org/marketplace/addons/simple-image-gallery/... (free)
http://www.concrete5.org/marketplace/addons/deluxe-image-gallery/... ($25)
http://www.concrete5.org/marketplace/addons/gallery/... (free)


For a list of images that point to separate pages try these:
http://www.concrete5.org/marketplace/addons/thumbview-template/... (free)
http://www.concrete5.org/marketplace/addons/dojo-page-filter-pro/... ($20)
http://www.concrete5.org/marketplace/addons/page-list-views/... ($25)
robagp replied on at Permalink Reply
Thank you for your answer, but it is not good, because I can't make 8 columns and 30 rows /this is important/.
This page is my bookmarks. I use smal pictures /site logos/ and when I click on the logo that open the site. If I use more pages, too many click need to open the page... on the big page, the scrolling is better, and faster.
This is my old site:
http://gaab.atw.hu/
I want to change this.
SuperNova replied on at Permalink Reply
SuperNova
put in main.css:
.links img {
  width: 136px;
  height: 83px;
  margin: 5px;
  border: 1px solid #666;
  opacity: 0.9; /* just effect */
}
.links img:hover {opacity:1;}  /* just effect */


concrete5 default theme:
put an additional area before 'Main'-Area in 'full.php' right after 
<div id="body">
in line 7:
<div class="links">
  <?php 
  $a = new Area('Links');
  $a->display($c);
  ?>
</div>


In the new Area 'Links' you just put your (240) images blocks with your images with the links. After another they will be just vertical in edit mode, don't mind. After publishing the images appear how you wanted.
The width of the area 'Links' should has the right width to work. More width means more images in a row.

Example values taken from your side:
Image-width is set to 136px + 2px border + 10px space between = 148px
8 column x 148px = at least 1184px width for the Area.

So change '#Page'-width to 1086px (a bit more) in main.css in line 13.
Don't forget to choose the right page-type
robagp replied on at Permalink Reply
I tried, but I missed something :-(
I change main.css and full.php, but not working.
I think the full.php is the problem. I don't understand what I realy need to do there.
Now, the full.php is this:
<?php
defined('C5_EXECUTE') or die("Access Denied.");
$this->inc('elements/header.php'); ?>

<div id="central" class="no-sidebar">

<div id="body">
<div class="links">
<?php

$a = new Area('Links');
$a->display($c);

?>
</div>
</div>
<div class="spacer"> </div>
</div>

<?php $this->inc('elements/footer.php'); ?>
SuperNova replied on at Permalink Reply
SuperNova
Leave 'Main' in there, 'Links' is only for your image-links.
Mine looks like this:
<?php defined('C5_EXECUTE') or die("Access Denied.");
$this->inc('elements/header.php'); ?>
   <div id="central" class="no-sidebar">
      <div id="body">   
         <div class="links">
           <?php 
           $a = new Area('Links');
           $a->display($c);
           ?>
         </div>      
         <?php 
         $a = new Area('Main');
         $a->display($c);
         ?>
      </div>
Viewing 15 lines of 18 lines. View entire code block.


Do like following:
- copy the 'default'-dir located in 'concrete/themes/' on your local computer
- modify the files as you want (full.php, main.css)
- change content of 'description.txt' to be able to recoginze your own theme
- change 'thumbnail.png' if another icon is wished
- rename the folder 'default'
- upload your (renamed) theme folder to 'themes/' (not concrete/themes/)
- go to dashboard->themes: install and activate your theme
- may clear cache (Dashboard -> System & Settings -> Clear Cache)
So create your image liks as described before.