Changing the item set page layout

Is there a way to change the layout of the Item Sets page? I searched through the browse.phtml and style.css file and didn’t see how to change the column layout. At the top there is a 2 column layout with a big empty space on the left side and the description and other metadata are in a narrow column on the right. Below is the list of items in the item set in a one column layout.

You can do whatever layout you want on any page, pretty much.

I think you’re talking about the “show” page for an item set, the one that lists out the items that belong to the set. From your message you might know this already, but item sets show is a slightly strange view, since it is mostly listing out items, it’s actually the item/browse.phtml that controls it.

I just checked the browse.phtml page and that is not the page in reference. Here is the link to a screenshot where you can see the big empty space on the top left side of the content area: http://rileyarchives.org/images/collectionspg_screenshot.jpg

That page you’ve shown the screenshot of is item/browse.phtml: the “show” page for a set, which uses the item browse view. In that file you’ll see there’s code that’s only used when viewing a set, used to show the set metadata.

There’s definitely a problem in that screenshot: the narrow column of metadata up top is supposed to show where the blank left column below is. It looks like you’re using the default theme. Can you share what version of the theme, and what version of Omeka S, you’re using?

Also: have you customized the theme at all, by editing files, using CSS Editor, or something similar?

We are using Omeka S 3.1.1 as the digital archive is about 2-3 years old. The theme being used is the default theme. As for customizing the CSS, no I have not. There is only some custom HTML on the Home and About pages.

There’s something a little odd about the HTML being used for this page on your site… it doesn’t seem to have a wrapper container that should be there around the list of items. With the version of Omeka S you have, that wrapper should definitely be there.

Do you have a file in your theme folder named view/omeka/site/item/browse.phtml ? If you do it indicates that your default theme is customized and the fix would involve either removing that customized file or updating it.

I just updated Omeka to version 3.2.1 and the default theme to 1.6.4 and there is still the big empty space on the left. Also, in the default theme folder there is only a layout.phtml file at the following location theme/default/view/layout. The confusing thing is that I’m using the same theme with the same version of Omeka for another digital archive project and the empty space does not appear. I’m confused as to why this is happening.

OK, so, you’re saying that the only thing inside your “theme/default/view” folder is a “layout” folder with one file, layout.phtml. Correct? There’s no other folders in there under “view” inside the theme?

If that’s the case, then I’ll ask you to share the contents of another file: this time one from the Omeka S core. Can you paste here the contents of the file application/view/omeka/site/item/browse.phtml?

<?php
$translate = $this->plugin('translate');
$escape = $this->plugin('escapeHtml');
$this->htmlElement('body')->appendAttribute('class', 'item resource browse');

$filterLocale = (bool) $this->siteSetting('filter_locale_values');
$lang = $this->lang();

$query = $this->params()->fromQuery();
$itemSetShow = isset($itemSet);
if ($itemSetShow):
    $this->htmlElement('body')->appendAttribute('class', 'item-set');
    $query['item_set_id'] = $itemSet->id();
endif;
$sortHeadings = [
    [
        'label' => $translate('Title'),
        'value' => 'dcterms:title'
    ],
    [
        'label' => $translate('Identifier'),
        'value' => 'dcterms:identifier'
    ],
    [
        'label' => $translate('Class'),
        'value' => 'resource_class_label'
    ],
    [
        'label' => $translate('Created'),
        'value' => 'created'
    ],
];
?>

<?php if ($itemSetShow): ?>
    <?php echo $this->pageTitle($itemSet->displayTitle(null, ($filterLocale ? $lang : null)), 2); ?>
    <h3><?php echo $translate('Item set'); ?></h3>
    <div class="metadata">
        <?php echo $itemSet->displayValues(); ?>
    </div>
    <div class="item-set-items">
    <?php echo '<h3>' . $escape($translate('Items')) . '</h3>'; ?>
<?php else: ?>
    <?php echo $this->pageTitle($translate('Items'), 2); ?>
<?php endif; ?>

<?php echo $this->searchFilters(); ?>

<div class="browse-controls">
    <?php echo $this->pagination(); ?>
    <?php echo $this->hyperlink($translate('Advanced search'), $this->url('site/resource', ['controller' => 'item', 'action' => 'search'], ['query' => $query], true), ['class' => 'advanced-search']); ?>
    <?php echo $this->sortSelector($sortHeadings); ?>
</div>

<?php $this->trigger('view.browse.before'); ?>
<ul class="resource-list">
<?php
$headingTerm = $this->siteSetting('browse_heading_property_term');
$bodyTerm = $this->siteSetting('browse_body_property_term');
foreach ($items as $item):
    $heading = $headingTerm ? $item->value($headingTerm, ['default' => $translate('[Untitled]'), 'lang' => ($filterLocale ? [$lang, ''] : null)]) : $item->displayTitle(null, ($filterLocale ? [$lang, ''] : null));
    $body = $bodyTerm ? $item->value($bodyTerm, ['lang' => ($filterLocale ? [$lang, ''] : null)]) : $item->displayDescription(null, ($filterLocale ? [$lang, ''] : null));
?>
    <li class="item resource">
        <?php if ($itemThumbnail = $this->thumbnail($item, 'medium')): ?>
        <?php echo $item->linkRaw($itemThumbnail); ?>
        <?php endif; ?>
        <h4><?php echo $item->link($heading); ?></h4>
        <?php if ($body): ?>
        <div class="description"><?php echo $escape($body); ?></div>
        <?php endif; ?>
    </li>
<?php endforeach; ?>
</ul>
<?php echo ($itemSetShow) ? '</div>' : ''; ?>
<?php $this->trigger('view.browse.after'); ?>
<?php echo $this->pagination(); ?>

Okay so, that looks okay but, it’s not the markup that’s actually being used for your page.

There’s a key line in this view file that you pasted that’s not actually there in the page being rendered:

<div class="item-set-items">

Having this missing is what’s causing your problem. There are some other changes to your view but this is the most relevant one. The question is: why is it missing? Generally a view comes either from a theme, a module, or the core. You’ve told me that your theme doesn’t have this file in it (which is the normal case), and your core copy of the file you just pasted here looks fine also.

This pretty much leaves a module as the culprit. A quick look shows me you’re using the module FieldsAsTags and that looks like the most likely thing to be causing the problem. Try disabling that module and see if that fixes the problem.

I disabled the FieldAsTags module and the empty space has been removed. Thank you very much for your assistance with this matter.