This question is answered.


Permlink Replies: 28 - Pages: 2 [ 1 2 | Next ] - Last Post: 18-Dec-2019 00:51 Last Post By: RobM Threads: [ Previous | Next ]
christr

Posts: 51
Registered: 26-May-2012
JOURNAL align images and text
Posted: 07-Dec-2019 10:41
 
  Click to reply to this thread Reply
Ik like to align images and text, so the text is floating around the images. Possible?

TXS already. I like this skin!
RobM

Posts: 3,266
Registered: 4-Aug-2006
Re: JOURNAL align images and text
Posted: 07-Dec-2019 10:53   in response to: christr in response to: christr
 
  Click to reply to this thread Reply
If you mean like the skin’s About page then that page shows the code I used. If you want all images, in a project, and their comments to be like that then I can make a new template page to do that.
christr

Posts: 51
Registered: 26-May-2012
Re: JOURNAL align images and text
Posted: 07-Dec-2019 20:22   in response to: RobM in response to: RobM
 
  Click to reply to this thread Reply
That is a very quick response! Txs for that!

Please see the problem page:
http://www.imagixs.net/likeuren/kruidenlikeuren/absinth/index.html

I can not tell you more....

This page is an addendum on my photo portfolio site: new hobby: creating liquors.
Most importantL the labels I created on ever bottle.

Greetings, Chris!
RobM

Posts: 3,266
Registered: 4-Aug-2006
Re: JOURNAL align images and text
Posted: 07-Dec-2019 21:37   in response to: christr in response to: christr
 
  Click to reply to this thread Reply
christr wrote:
That is a very quick response! Txs for that!
Pure luck, sorry, as I was looking in the forums
Change ../res/absint3.jpg to ../../res/absint3.jpg
The image will never be more than 33% of the browser width, only on really large monitors will it appear at full size. This is so that the text wraps around the image on mobile devices, only on very, very small screens will the image and text not wrap.

This page is an addendum on my photo portfolio site: new hobby: creating liquors.
Most importantL the labels I created on ever bottle.
If it is just a few pages with images then you can use that technique, but if you will have lots of labels then an option for this layout would be better.
Thanks for trying the skin out.
RobM

Posts: 3,266
Registered: 4-Aug-2006
Re: JOURNAL align images and text
Posted: 07-Dec-2019 22:54   in response to: RobM in response to: RobM
 
  Click to reply to this thread Reply
I have attached two template files, index-floatContentLeft and index-floatContentRight.
With the project active use Menu > Tools > Open directories > Skin directory, then quit jAlbum.
In your OS's file system the Journal skin will be visible, open the 'Templates' subfolder and add the two files.

Restart jAlbum and load your project.
Move the image from the project's 'res' folder into the absinth folder and then put your comments on the image within the folder, instead of the folder. Now use the 'New page' icon to open a dropdown menu and pick the index-floatContentLeft.htt file. Move it so it is the first item in the folder and then rename it to index.htt.

Remake the album.
christr

Posts: 51
Registered: 26-May-2012
Re: JOURNAL align images and text
Posted: 08-Dec-2019 12:34   in response to: RobM in response to: RobM
 
  Click to reply to this thread Reply
Hello RobM!

This is much better! And responsive too. Great!

The moment the pages with my liquor labels are in place, I am thinking about starting a guest column, using the Journal-skin.
There are some friends who like to writes stories about his/her favorite photographer(s). Bij adding photos of this person my friens can explain what is so striking in the work of this photographer!

For now: please visit the new layout:
http://www.imagixs.net/likeuren/index.html

I think I found some problems:
1 The page titel is missing. Like "absinth". (Preferences->Texts->Folder/Template menu)
2 In the pages index-second-level, the image on top is not the same image as the image on top in the index-first level. Ik stead the image is used with is also part of the text in the map.
3 The floatinmg effect is missing: text around the image.
4 The margin around the images is not there. I found a solution: I start de texts with
. But... the moment the floatining of text is active, text maybe touches the image.....
5 The index-floatContentRight/Left.htt are acting in the same way: adjusting everything LEFT with the image on top.
If I use 2 images: the second is placed under de first. No problem.
6 In the comment field of the inages I place text. The text is put in the album. No problem. In the comment field of the image I can use text makeup, as "
" (new line). This one, <break> works great!
If I use "<bald> </bald>" or <ital> </ital>, this is not working on the album page.
Little bit sad..... Not too much sad.

Overall: a fine new skin on jAlbum, great possobilities!
Thank you, RobM!

Chris

Edited by: christr on 08-Dec-2019 12:35

Edited by: christr on 08-Dec-2019 12:37

Edited by: christr on 08-Dec-2019 12:38

Edited by: christr on 08-Dec-2019 12:40

Edited by: christr on 08-Dec-2019 12:41

RobM

Posts: 3,266
Registered: 4-Aug-2006
Re: JOURNAL align images and text
Posted: 08-Dec-2019 17:54   in response to: christr in response to: christr
 
  Click to reply to this thread Reply
christr wrote:
I think I found some problems:
1 The page titel is missing. Like "absinth". (Preferences->Texts->Folder/Template menu)
For a page (folder) on Absinth you add the page title to the folder's title field, and if you want an introduction add a comment to the folder's comment field.. Then for each image within the folder add a title and comment to the images.
2 In the pages index-second-level, the image on top is not the same image as the image on top in the index-first level. Ik stead the image is used with is also part of the text in the map.
At the moment, to get the same page layout you need to and the index-float template to each folder. I'll have a look at making it an option so you don't need to add the template for every folder.
3 The floatinmg effect is missing: text around the image.
Sorry, I missed out a bit of required CSS. I'll try and do an update later today.
4 The margin around the images is not there. I found a solution: I start de texts with
. But... the moment the floatining of text is active, text maybe touches the image.....
See 3 above.
5 The index-floatContentRight/Left.htt are acting in the same way: adjusting everything LEFT with the image on top.
See 3 above. Left should have the image to the left of the page, and right to the right. Because of the missing CSS the image you have is too big to see the difference.
If I use 2 images: the second is placed under de first. No problem.
Same issue, missing a bit of CSS
6 In the comment field of the inages I place text. The text is put in the album. No problem. In the comment field of the image I can use text makeup, as "
" (new line). This one, <break> works great!
If I use "<bald> </bald>" or <ital> </ital>, this is not working on the album page.
The page shows that where you have used
<b>Absinth no 1</b>
that the text is actually bold - but with the font chosen you have to look at it closely to see it.
christr

Posts: 51
Registered: 26-May-2012
Re: JOURNAL align images and text
Posted: 08-Dec-2019 20:42   in response to: RobM in response to: RobM
 
  Click to reply to this thread Reply
Hello RobM!

Txs for your almost imidiate response on my reaction.
Right now it is the end of my free sunday and I like to rest after testing my latest new liquor.
But, tomorrow I am ancious to spit in your reaction and I thank you for your respons.
You get my results tomorrow.

I am living in the Netherlands. I know the time differences, about 8 hours - if you are a resident of the USA.

Have a good afternoon and evening.

Chris
RobM

Posts: 3,266
Registered: 4-Aug-2006
Re: JOURNAL align images and text
Posted: 08-Dec-2019 22:39   in response to: christr in response to: christr
 
  Click to reply to this thread Reply
I have uploaded a new version of the skin which includes the choice of float left and float right on the Image settings.

Remove any of the templates added to your project and select one of the float choices, then remake the album. If you want to change the space between the images and text then on the skin's CSS setting add, for float left
.floatContentLeft {
margin:0px 10px 10px 0px;
}
Then change the values as required starting with spacing for the top, right bottom and left. Rebuild the album and check the spacing.
For float right change the first line to .floatContentRight {

I hope that is closer to what you want.

By the way, I live in the United Kingdom, so our time difference is only an hour (behind you).

Let me know if you need any further help.
christr

Posts: 51
Registered: 26-May-2012
Re: JOURNAL align images and text
Posted: 09-Dec-2019 14:32   in response to: RobM in response to: RobM
 
  Click to reply to this thread Reply
Hello RobH!

Great job!

I changed:
  • type font (bald is now better)
  • coments for page names etc: YES!
  • tested floating: sublime!
  • margins: super!
Please check the lastest adjustments.
http://www.imagixs.net/likeuren/index.html

Again some remarks, no real problems left.
1 the "h2 - /h2" etc gives an extra empty line. I do not like that. Much space in use for no reason. In case I want a extra line, I hit the ENTER.
2 forcing text to a next line: <break> is doeing the job, but CTRL-ENTER too!
Ik was looking for the right escape sign, did not found it. (is on your instruction/demo site). Maybee a good thing to adjust the instruction/demo pages, including of course the new 'float' possibilities.
3 I tested the max length op de image at the top of pages. The image at last page, the Apfelsine, has a with of 1000 pix. You see about the half of it. No problemm but....
4 I tested the page layout by making the window on my desktop smaller and wider.
The text is adjusting beautifull. No problem there. But....
I like to makeup text/images in a way the page looks good. I
So: give me the oportunity to specify the max page with. In Photoblogger I use 1240 pix, works good.
Then is it probably possible to let me use top-of-page images with any width, and you truncate them to te max width of te page.
5 The last one!
I used on the Absinthe and te Vespetro pages multiple image with several sizes, the text the same.
I made the images so they fit in an rectangle of 600x600 or 300x300 or 200x200 pix.
You see the results on those pages.
Is it possible to specify the display demensions of images?
You do not enlarged them in the skin, you only minize the demensions proportional if the original image demensions are larger than the display sizes I requested?

So, the Journal skin is a real wonder. If you want an other demo site: use mine, for at least one year, URL above.

TXS!
Chris

Edited by: christr on 09-Dec-2019 14:32

Edited by: christr on 09-Dec-2019 14:33

Edited by: christr on 09-Dec-2019 14:34

Edited by: christr on 09-Dec-2019 14:35

Edited by: christr on 09-Dec-2019 14:35
RobM

Posts: 3,266
Registered: 4-Aug-2006
Re: JOURNAL align images and text
Posted: 09-Dec-2019 14:51   in response to: christr in response to: christr
 
  Click to reply to this thread Reply
I will have a look at your questions later today, busy with other things at the moment. I think the absinth page needs editing as it has three entries saying the same thing.
AndreWolff

Posts: 1,769
Registered: 14-Dec-2007
Re: JOURNAL align images and text
Posted: 09-Dec-2019 14:57   in response to: RobM in response to: RobM
 
  Click to reply to this thread Reply
Attachment IMG_1878.PNG (538,2 KB)
RobM wrote:
I think the absinth page needs editing as it has three entries saying the same thing.
The same problem for the Vespetro page and 50% of the page width is not used on an iPhone, see attached screenshot.

And I don't see the recipe for Limoncello!
RobM

Posts: 3,266
Registered: 4-Aug-2006
Re: JOURNAL align images and text
Posted: 09-Dec-2019 15:05   in response to: AndreWolff in response to: AndreWolff
 
  Click to reply to this thread Reply
AndreWolff wrote:
…and 50% of the page width is not used on an iPhone, see attached screenshot.
There is a setting Typography > Set line length for text, it just needs increasing from the default.
AndreWolff

Posts: 1,769
Registered: 14-Dec-2007
Re: JOURNAL align images and text
Posted: 09-Dec-2019 16:05   in response to: RobM in response to: RobM
 
  Click to reply to this thread Reply
RobM wrote:
There is a setting Typography > Set line length for text, it just needs increasing from the default.
That are pixels, which is not responsive.
To get it responsive I think you should offer a length in %.
christr

Posts: 51
Registered: 26-May-2012
Re: JOURNAL align images and text
Posted: 09-Dec-2019 19:09   in response to: AndreWolff in response to: AndreWolff
 
  Click to reply to this thread Reply
AI!!!
Limoncello!

I send you the recipe.
No, I publish it on mij liquor pages for you!

In the mean time, I deleted the double texts.
I only want to show you the differences.

I have no hurry on improvemenst of the skin this week.
Acually, next thursday is the first day I can work and test your coding work!
Friends are coming for diner next wedsday and I have to do some real work.
They are not easy, they are spoiled!

Please, get me updated in the meantime on your improvements of your skin!

This afternoon I made my 2020-NewYear wish. Can I put that image file as a addendum to this message?

Chris

Edited by: christr on 09-Dec-2019 19:37

Legend
Forum admins
Helpful Answer
Correct Answer

Point your RSS reader here for a feed of the latest messages in all forums