|
Title: Image with link alignment problem Post by: LukaL on June 20, 2018, 12:17:07 PM Hi,
I am a team member of Alloy Project, and we have recently updated our initial bitcointalk thread post. Now it is one big picture. I wanted to apply links to some parts of picture, that is why I have cut it on smaller pieces, and apply links to few of those pieces. All good so far. The problem I encountered on is that when I apply link around picture it automatically pushes picture for 0.2 cm into the right, and now picture is not aligned with picture above or below... You can take a look here : https://bitcointalk.org/index.php?topic=3002653.0 Do you have any idea how to "refuse" this 0.2 cm move of picture into the right, when you apply link around it. I have tried align left, center, but there is still this 0.2 cm difference I tried to put link around whole picture - in this case alignment is ok, but now whole picture is a link, or it acts as link, and users don't really distinguish which are real links and which are "fake". Is there a possibility to align also other picture parts (the ones without link around it) into the right for some xx cm. I would be very thankfull if you could help, Best regards, Alloy Project team Title: Re: Image with link alignment problem Post by: mdayonliner on June 20, 2018, 12:24:13 PM Is there a possibility to align also other picture parts (the ones without link around it) into the right for some xx cm. I am not sure if it's gonna work or not... try adding a white-space before the non linked image. Title: Re: Image with link alignment problem Post by: LukaL on June 20, 2018, 12:31:04 PM Nop .. I tried and this creates whole empty line (100% width), and pushes img into new line
Title: Re: Image with link alignment problem Post by: JeremyB on June 20, 2018, 01:10:39 PM I don't understand. If I quote your ANN and preview it, it is perfectly aligned.
https://i.imgur.com/ZoelkZO.png Try to quote your ANN, check the preview. Then if it works try to edit by removing quotes lines (1st & last lines). Second solution, try to specify image with like: Code: [img width=2055] Third solution, I've seen some ANN with 2000 pixels image, maybe there is a limit there, try to resize them all. Title: Re: Image with link alignment problem Post by: TryNinja on June 20, 2018, 01:22:06 PM I got it. It's because of the URL tag before the image, which puts the image a little more to the right.
I found a solution: add this to every image that doesn't have a link Code: [right][img width=1529]IMG URL HERE[/img][/right] This will put every image a little bit to the right, making them align with the ones with an url. Edit: it's actually "width=1529" and not 1300. Here is the whole working code for the thread: Code: [right] Title: Re: Image with link alignment problem Post by: LukaL on June 20, 2018, 01:25:36 PM Thanks guys for all this suggestions... let me try them out now and I will get back to you ;)
Title: Re: Image with link alignment problem Post by: LukaL on June 20, 2018, 01:59:15 PM I don't understand. If I quote your ANN and preview it, it is perfectly aligned. https://i.imgur.com/ZoelkZO.png Try to quote your ANN, check the preview. Then if it works try to edit by removing quotes lines (1st & last lines). Second solution, try to specify image with like: Code: [img width=2055] Third solution, I've seen some ANN with 2000 pixels image, maybe there is a limit there, try to resize them all. Yes I noticed that to ... preview is ok, when I post it its not ok... Nothing works, I haven't tried to resize images to 2000px, specifying to width=2000 doesn't work... I got it. It's because of the URL tag before the image, which puts the image a little more to the right. I found a solution: add this to every image that doesn't have a link Code: [right][img width=1529]IMG URL HERE[/img][/right] This will put every image a little bit to the right, making them align with the ones with an url. Edit: it's actually "width=1529" and not 1300. Here is the whole working code for the thread: Code: [right] Unfortunately it doesn't work... I believe this one is also tricky, because it depends on users screen resolution... so the ones with the same resolution to yours will see picture ok, others no... Title: Re: Image with link alignment problem Post by: TryNinja on June 20, 2018, 02:03:36 PM Hmm... Found another solution: put an URL tag in every image, so everything is a little bit to the right.
Add this to every image that doesn't have an URL: Code: [iurl=#]image here[/iurl] This makes that people can click the image but nothing will happen. While the others will lead to the right page. Edit: here it is Code: [iurl=#][img]https://vps-city.com/alloybtc_talk/H1.jpg[/img][/iurl] Title: Re: Image with link alignment problem Post by: LukaL on June 20, 2018, 02:11:28 PM Hmm... Found another solution: put an URL tag in every image, so everything is a little bit to the right. I am not really sure about that... people will not distinguish between real links and "fake" ones ... I mentioned this already ... Thanks for suggestion though... Title: Re: Image with link alignment problem Post by: tbct_mt2 on June 20, 2018, 02:30:42 PM ~ Hi Luka,I have my own topic on images attached adjustments and hyperlinks, which might be helpful for your interest. Guideline on posting images (with size adjustments), hyperlinks (https://bitcointalk.org/index.php?topic=3974517) Title: Re: Image with link alignment problem Post by: JeremyB on June 20, 2018, 06:24:58 PM Hmm... Found another solution: put an URL tag in every image, so everything is a little bit to the right. I am not really sure about that... people will not distinguish between real links and "fake" ones ... I mentioned this already ... Thanks for suggestion though... I tried many things but can't find a suitable solution. From my analysis of other ANN, they always use URL for every parts. Usually the "standard" link points to the main website, so they are not "fake" links but general ones. Title: Re: Image with link alignment problem Post by: LukaL on June 20, 2018, 06:38:38 PM Thanks guys for trying to help... I really appreciate your effort.
It really seems applying link over whole picture is the only way to align it... I am just not yet decided if it is better like it is now - clear links, but alignment problem; or it is better with link around whole img - confusing links, but correct alignment... Title: Re: Image with link alignment problem Post by: LukaL on June 20, 2018, 07:03:05 PM Please join our discord channel and contact me there... I would like to show some gratitude :)
Title: Re: Image with link alignment problem Post by: JeremyB on June 20, 2018, 08:35:41 PM Thanks guys for trying to help... I really appreciate your effort. It really seems applying link over whole picture is the only way to align it... I am just not yet decided if it is better like it is now - clear links, but alignment problem; or it is better with link around whole img - confusing links, but correct alignment... Looks far better without alignment issue. People are used to search different links on ANN images, not a big issue imo. Please join our discord channel and contact me there... I would like to show some gratitude :) Thanks for the proposal, will join. Title: Re: Image with link alignment problem Post by: LukaL on June 21, 2018, 05:35:52 AM Thanks guys for trying to help... I really appreciate your effort. It really seems applying link over whole picture is the only way to align it... I am just not yet decided if it is better like it is now - clear links, but alignment problem; or it is better with link around whole img - confusing links, but correct alignment... Looks far better without alignment issue. People are used to search different links on ANN images, not a big issue imo. You are probably right ... will talk with the team and we will decide :) Title: Re: Image with link alignment problem Post by: Makkara on June 21, 2018, 06:16:05 AM EDIT: the preview seemed fine :-\ Title: Re: Image with link alignment problem Post by: LukaL on June 21, 2018, 06:21:27 AM Yep, preview always looks fine, when you post it its not ok ... don't know why :/
Title: Re: Image with link alignment problem Post by: Makkara on June 21, 2018, 06:25:38 AM i got something working here, it seems to be related with the size and alignment :o
https://vps-city.com/alloybtc_talk/H7.jpg https://vps-city.com/alloybtc_talk/H8.jpg (https://tradeogre.com/exchange/BTC-XAO) https://vps-city.com/alloybtc_talk/H9.jpg https://vps-city.com/alloybtc_talk/H10.jpg (https://altex.exchange/markets&pair=BTC_XAO) https://vps-city.com/alloybtc_talk/H11.jpg https://vps-city.com/alloybtc_talk/H12.jpg (https://maplechange.com/markets/xaobtc) https://vps-city.com/alloybtc_talk/H13.jpg https://vps-city.com/alloybtc_talk/H7.jpg https://vps-city.com/alloybtc_talk/H8.jpg (https://tradeogre.com/exchange/BTC-XAO) https://vps-city.com/alloybtc_talk/H9.jpg https://vps-city.com/alloybtc_talk/H10.jpg (https://altex.exchange/markets&pair=BTC_XAO) https://vps-city.com/alloybtc_talk/H11.jpg https://vps-city.com/alloybtc_talk/H12.jpg (https://maplechange.com/markets/xaobtc) https://vps-city.com/alloybtc_talk/H13.jpg Title: Re: Image with link alignment problem Post by: LukaL on June 21, 2018, 07:10:27 AM Ok this looks promising... :)
Yes this actually works... the problem is you have static width, and if someone is using lower screen resolution it will again be wrongly aligned for him... Is there an option to set width in % ... instead of width=1200 -> width=90% ... width=90% doesn't work, can I do it somehow differently? But this width=1200 seems like the best solution so far... Title: Re: Image with link alignment problem Post by: JeremyB on June 21, 2018, 09:31:42 AM If enclosing it with a link is the problem, why don't you just enclose the other parts in a "#" (blank) link for them to behave like the others? Same issue as mentioned bu the OP: users will not easily distinguish real vs "fake" links (i.e: I always have a hand pointer over the whole image there is a real link or not). Title: Re: Image with link alignment problem Post by: nc50lc on June 21, 2018, 09:37:52 AM Same issue as mentioned bu the OP: users will not easily distinguish real vs "fake" links (i.e: I always have a hand pointer over the whole image there is a real link or not). Not at all, when users try to click the empty link, there will be no response.But if they click on the right spot, they will be redirected to the correct url. Now the different links work as intended. But yes, the cursor will always indicate that there's a link. What he meant by that in the OP is, he enclosed the whole image in a [url][url] tag making the whole post linked to a single url. This: I tried to put link around whole picture - in this case alignment is ok, but now whole picture is a link, or it acts as link, and users don't really distinguish which are real links and which are "fake". <Edit> Never mind, I realized that it was slightly the same with Tryninja's reply (https://bitcointalk.org/index.php?topic=4501577.msg40523390#msg40523390). <Update> How about, make use of acronym tags to display a "hover info" to the real links whenever the mouse points to it. Example: (Point your mouse pointer to any link) Quote from: alloyproject https://vps-city.com/alloybtc_talk/H7.jpg (#post_) https://vps-city.com/alloybtc_talk/H8.jpg (https://tradeogre.com/exchange/BTC-XAO) https://vps-city.com/alloybtc_talk/H9.jpg (#post_) https://vps-city.com/alloybtc_talk/H10.jpg (https://altex.exchange/markets&pair=BTC_XAO) https://vps-city.com/alloybtc_talk/H11.jpg (#post_) https://vps-city.com/alloybtc_talk/H12.jpg (https://maplechange.com/markets/xaobtc) https://vps-city.com/alloybtc_talk/H13.jpg (#post_) Code (for the whole ANN thread): Double-check everything for typos especially the links Code: [iurl=#][img]https://vps-city.com/alloybtc_talk/H1.jpg[/img][/iurl] Title: Re: Image with link alignment problem Post by: LukaL on June 22, 2018, 07:27:46 AM This seems really nice solution... thank you for that... I think we will go with this one! :D
You guys are awesame! |
