Hello,
I hope you can please help me - it's a really simple question for most, but I'm new to this!
What is the html code to enter for separators?

I have a gallery of images that are all squishing up next to each other in the row and I simply need to add some blank space between them.
So I'm in the edit views/ basic settings/ row style/ fields settings/ row style options.

It gives me a check box for: Content: Gallery Image , then the explanation "inline fields will be displayed next to each other rather than one after another.
Then gives me a box to enter the separator, followed by the explanation "The separator may be placed between inline fields to keep them from squishing up next to each other. You can use HTML in this field."

I've inputted into the box BR (with arrows on either side) then "update defaults" to save it- and it made absolutely no difference. Ive also tried


, tried adding numbers, nothing seems to bring any changes at all. I've clicked the check box for my content: gallery image, and tried again with it unchecked.

What should I do? What is the html code to just add some space between my images that this box is asking me to enter?

Thank you!!

Comments

Drave Robber’s picture

For a quick fix, you can try throwing in a few non-breaking spaces:

   

Advanced options are various – you can even draw a vignette image to use there.

greenerscreen’s picture

Thanks so much for the suggestion - but unfortunately again it made no change.

Any other suggestions more than welcome? Not sure how I can draw a vignette image into the input box.

Drave Robber’s picture

Oops, I misunderstood your question somewhat.

That separator is used to separate inline fields of the same item (usually node) – in case of the default image_gallery view, there are only two fields (image and node title), and if you'd chose to display them next to one another, you could something in between there.

Putting some space between items is usually achieved using CSS. Are your efforts online somewhere?

greenerscreen’s picture

Ah - that does perhaps explain what is going on.
Yes, I am trying to add more space between images, from the view display of images in a gallery.

e.g. the images down the righthand side column, are all from 1 gallery, displaying as a view - style unformatted. When I make it a grid there seems to be a little more space between the images. but the 'separator' in the fields setting doesn't do anything:

http://www.wendydent.com/short_docs

Thanks again

Drave Robber’s picture

Some space between rows, qualified by view name so that it won't accidentally affect other views:

.view-node-gallery-blocks-Visions .views-row {
  margin-bottom:5px;
}

You can put more if you want. :) (I tried to make it about the same as the space between images and the vertical line to the left)

greenerscreen’s picture

Thank you - Is that code to add/rewrite to CSS style sheet instead?

I entered that into the box where it says 'separator', and tried 40px even, but again it makes no difference. Is there any way that I can add a screenshot to this comment/forum so I can show you the input box for 'separator' in the edit view/ row settings that I'm referring to?

http://www.wendydent.com/admin/build/views/edit/node_gallery_blocks_Visi...

the link is calling it the 'views tab block'. That's where I typed in your suggestion!

Thanks again

Drave Robber’s picture

This is to add to your (custom) CSS, yes.

The separator won't be of any help here.

Drave Robber’s picture

On a more general note, in CSS parlance (and therefore on the web generally) 'inline' means "on the same horizontal line, no line breaks before or after", the opposite to 'inline' being 'block'. So there is actually nothing 'inline' in this view, hence the confusion.

greenerscreen’s picture

Ah -sorry if I have confused. I used that term as that is what was used in the box I'm in,
which appears like this:

"Block: Row Style Options"

Status: using default values.

"Inline fields:
(checkbox): Content: Gallery Image (field_node_gallery_image)
Inline fields will be displayed next to each other rather than one after another

Separator
[This is the box I'm trying to enter code into]
The separator may be placed between inline fields to keep them from squishing up next to each other. You can use HTML in this field.

Checking or unchecking the inline fields makes no difference either. Running cron & clearing caches makes no difference. Nothing I'm entering seems to give more space between the images.
I'm confounded :(

greenerscreen’s picture

thanks for clarifying the separator isn't going to solve the trick to add more space here.
(The descriptor about stopping things squishing next to each other certainly sounded like that was the tool!)

I really appreciate your help. I'll post/comment back when I've added your code to the CSS!

Drave Robber’s picture

"Inline fields will be displayed next to each other" – that means fields of the same item, not fields of different items. If there is only one field, making it inline will have no effect.

Inline field display is used in the following manner – suppose you have two fields:

(checkbox) Node: title
(checkbox) User: name

By default, they would be displayed like:

My first blog post
John Smith

By making the fields inline and adding a separator, e.g. |, you could turn this into:

My first blog post | John Smith
greenerscreen’s picture

aah.. thanks that does explain it. So that gave me an idea - I added another field for the title of the images, - so then I added a few BR's(in arrows) between the image and the title and it adds more space! I will play around with that.

http://www.wendydent.com/short_docs

Drave Robber’s picture

The downside is that it pushes the title to the next image, misleading as to which image has which title.

Here's an idea: in field options, you can choose 'Rewrite the output of this field' for the title field and replace it with a single space character (completely empty won't work). This way, you won't display the title, but will be able to keep the separator.

greenerscreen’s picture

That's a great idea, and it worked to make the title (of the image) blank. But it's still giving me the : that comes after the field name title (or in this case now the blank space). I tried entering for the name but it just prints that.
So I have the column of images spaced as I'd like but also ":"

Drave Robber’s picture

It seems you have selected 'Label: custom' and empty instead of 'Label: none' in field settings.

greenerscreen’s picture

Ah, I will keep my eye out for that. I checked it now though, and for the field Content: Gallery Image (field_node_gallery_image) it gave me the option of label none/ widget/ custom. But strangely for the field Parent Gallery:Node Title that option of choosing label none/widget/custom wasn't listed. It only has the option to enter the label name. So fortunately by entering nothing & minimising the characters to 0 it left it blank.

greenerscreen’s picture

Hooray! Figured out how to make the field blank: Type nothing in label. Select 'rewrite the output of this field' and put a blank space, as you suggested. Then select 'Trim the field to a maximum length' and type 0 for the length. And it outputs as a blank line.
Then in the row style settings for the field I entered in the 'separator' BR in arrow brackets three times to add three lines. I'll try the CSS re-write shortly. but at least with this workaround- voila- thanks to your help - there is now a good space between all the images!