이미지를 선택하면 태그를 앞뒤로 자동으로 삽입해 주는 컴포저 도구가 있으면 어떨까요?
4개의 좋아요
다음과 같은 방식으로 처리할 수 있습니다:
.d-image-grid:hover {
img {
-webkit-filter: brightness(60%);
transition: 0.5s;
}
}
.d-image-grid:not([data-disabled]) .d-image-grid-column img, .d-image-grid:not([data-disabled]) .d-image-grid-column>.lightbox-wrapper, .d-image-grid:not([data-disabled]) .d-image-grid-column>.lightbox-wrapper>.lightbox {
&:hover {
img {
-webkit-filter: brightness(100%);
transition: 0.5s;
}
transition: 0.5s;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
}
3개의 좋아요
[grid]
[/grid]
Hmm, 이 기능이 작동하면 좋겠습니다. 사용자에게 다른 곳에 호스팅된 외부 이미지에 링크를 걸도록 권장하고 있으며, 용량 절약을 위해 핫링크 이미지 다운로드를 비활성화했습니다.
다음 대안 방법은 작동할 수 있지만, 대부분의 사용자는 마크다운으로 그렇게 포맷하는 방법을 모를 것입니다(그들은 단순히 이미지 URL을 단독 줄로 붙여넣는 데 익숙합니다):
[grid]
[/grid]
외부 이미지를 클릭하여 전체 크기 버전을 볼 수 있도록 만드는 더 복잡한 방법은 다음과 같습니다:
[grid]
[](https://github.com/KDE/plasma-workspace-wallpapers/blob/master/IceCold/contents/images/5120x2880.png?raw=true)
[](https://getwallpapers.com/wallpaper/full/b/5/f/563687.jpg)
[](https://www.pixelstalk.net/wp-content/uploads/2016/06/Download-hd-nature-wallpaper.jpg)
[/grid]
수정: 처음에는 외부 이미지 URL을 사용했지만, Discourse는 코드 블록 내부의 텍스트까지 다운로드된 핫링크로 대체하는데, 이는 버그처럼 느껴집니다. 등폭 코드 블록의 내용은 절대 건드리지 말아야 합니다.
3개의 좋아요
훌륭한 새로운 기능 
… 사용자 중 한 명이 요청한 사항은, 이 수동 절차를 기억하는 데 도움이 되는 일종의 마크업 치트 시트가 있는지 여부입니다. 키보드 아이콘과 연관된 키보드 단축키 대화상자 팝업처럼 말이죠.
7개의 좋아요
방금 컴포저 툴바에 이미지 정렬 및 그리드 버튼을 추가하는 테마 컴포넌트를 만들었습니다
10개의 좋아요
확실히 버그인 것 같습니다!
1개의 좋아요
멋지네요. 불행히도 이메일이나 게시된 페이지를 통해 제공되지 않습니다. 
2개의 좋아요
네, 별도의 버그 보고서를 제출했습니다:
2개의 좋아요
네, 게시된 페이지에서는 Discourse 기능에 대한 접근이 매우 제한적입니다. 일반적인 라이트박스조차 이러한 페이지에서 작동하지 않습니다. 이미지를 클릭하면 이미지 뷰어가 표시되는 대신 URL이 바로 열립니다.
4개의 좋아요
이 방식은 정말 우아하게 작동합니다! 방금 데모를 해봤습니다.
의미가 있다면 이미지 정렬/.그리드 버튼 테마 컴포넌트의 기능을 갖추는 것에 투표하겠습니다.
이미지에 대한 기능이 있다면, 캡션을 추가할 수 있는 방법을 원합니다. 저는 우리 커뮤니티에서 이미지 출처를 명시하는 것을 권장하는데, 이는 이미지 설명을 사용하는 최선의 방법이 아닙니다.
8개의 좋아요
최소 핵심 설정에 명시적인 경고와 함께 선택적(opt-in) 옵션으로 추가하는 것은 어떨까요? 그렇게 하면 포럼 관리자가 원할 경우 해당 결정을 내릴 수 있고, CommonMark 스펙을 위반한다는 점을 인지할 수 있을 것입니다.
감사합니다
Jr
1개의 좋아요
여기서 원하시는 내용을 잘 이해합니다. (저도 같은 바람을 가지고 있습니다. 사용자가 아무것도 하지 않아도 여러 장의 사진을 업로드하면 자동으로 그리드 형태로 표시되길 원합니다.) 하지만 유지보수 관점에서 이 옵트인 옵션은 현실적으로 불가능합니다. 우리는 수천 개의 Discourse 인스턴스를 운영하며, 동일한 마크업이 일부 인스턴스에서는 다르게 동작하고 다른 곳에서는 그렇지 않으면 다양한 문제를 일으킬 수 있습니다. 안타깝게도 이는 유지보수하기 어렵습니다.
위 내용은 다음 단계로서 우리가 할 수 있는 최선의 방법입니다. (언제 실행될지는 확실하지 않지만, 누군가 이 문제를 해결하고 싶다면 기여를 환영합니다.)
8개의 좋아요
이 코드를 실행했는데
posts = Post.where(‘raw LIKE ?’, ‘%
%’)
posts.each do |p|
p.update!(raw: p.raw.gsub(/(.*?)</div>/m, ‘[grid]\1[/grid]’))
p.rebake!
end
오류가 발생합니다.
기호(')를 삭제하고 다시 입력해 보았지만 성공하지 못했습니다.
오류를 찾아주실 수 있나요?
감사합니다!
3개의 좋아요
Sora, 먼저 Rails 콘솔을 실행해야 해요: rails c
3개의 좋아요
기본적으로 모든 업로드된 이미지가 자동으로 깔끔한 그리드로 정렬되도록 설정할 수 있을까요?
5개의 좋아요
이것이 의도된 동작인지 확실하지 않지만, 라이트박스 최대 이미지 폭/높이 설정보다 작은 이미지가 그리드에 추가되면 이미지는 축소되어 표시되지만 원본 크기로 확대할 수 있는 방법이 없습니다(*).
예를 들어, 업로드된 이미지 11개로 그리드를 만들었습니다. 그중 8장은 640x480 크기로, 라이트박싱의 기본 이미지 폭/높이인 690x500보다 작았습니다. 나머지 3장은 각각 1200x372, 750x521, 750x509 크기였습니다. 마지막 3장은 라이트박싱되었습니다(class=lightbox-wrapper). 앞의 8장은 class=image-wrapper였기 때문에 약 300x250 크기로만 표시되었고, 더 큰 원본 크기로 확대해 볼 수 없었습니다.
(*) 이 동작은 최대 이미지 폭/높이 설정을 줄여서 변경할 수 있지만, 그렇게 하면 포럼의 다른 모든 이미지에 영향을 미칩니다.
그리드의 모든 이미지가 자동으로 라이트박싱되도록 하는 것이 더 좋다고 생각합니다. 또는 메인 이미지 라이트박싱 설정과 다른 설정을 사용하는 것도 방법입니다.
3개의 좋아요
그리드의 이미지가 이메일에도 복제되도록 할 계획이 있나요?
3개의 좋아요
지금은 아니에요. 솔직히 말씀드리면, 이메일에서 CSS는 여전히 큰 골칫거리입니다. 이메일 클라이언트마다 차이가 크고, 일관되게 렌더링하는 것이 매우 어렵거든요.
5개의 좋아요
완전히 이해했습니다. 확인해 주셔서 감사합니다 
3개의 좋아요
못생겼지만, 작동할 수는 있습니다: 그리드에 대한 하나의 합성된 이미지만 전송하는 것입니다.
더 나은 사용자 경험을 위해, 라이브 사이트의 해당 그리드에 링크할 수 있습니다.
1개의 좋아요