Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

latest 의 style 또는 script 를 base.html 의 head 에 넣을 수 있는 방법? #223

Open
kagla opened this issue Jan 12, 2024 · 6 comments
Assignees
Labels
feature New feature or request

Comments

@kagla
Copy link
Contributor

kagla commented Jan 12, 2024

templates/taeho/latest/main_list.html 에 선언된

<style type="text/css" media="screen and (max-width:1200px)">
  .main_bn {border-radius: 0px;}
 </style> 

<style type="text/css" media="screen and (max-width:1000px)">
 .main-slider .slick-dots {max-width: 200px;}
 </style> 

<style type="text/css" media="screen and (max-width:800px)">
  .main-slider .slick-dots {visibility: hidden;}
  .main-slider .slide-item > .slide-con > .slide-txt {width: 90%;}
 </style> 

위 코드를 base.html 의

<head>
...
</head>

사이에 넣을 수 있을까요?

@kagla kagla added the feature New feature or request label Jan 12, 2024
@Junanjunan
Copy link
Contributor

해당하는 style 태그 부분들만 따로 html file로 뽑아서 taeho/latest/main_list.html이랑 base.html의 head tag 안에 각각 {% include %} 로 넣는건 어떨까요?

@KimTom89
Copy link
Collaborator

최신글을 불러오는 방식들 (함수, include, import (macro))은 독립적인 실행방식이기 때문에 상위 블럭에 접근할 수 없습니다.
그러므로 main_list.html에서 직접 태그에 style태그를 넣을 수는 없습니다.

render되는 파일에서는 직접 style태그를 사용하는 것을 지양하고 css파일로 적용하는 것을 권장해야 할거 같습니다.

index.html

{% extends "base.html" %}

<!-- 여기에서 하위 렌더링 파일의 css를 추가한다.  -->
{% block head %}
    <link rel="stylesheet" href="{{ theme_asset('css/main_list.css') }}">
    <link rel="stylesheet" href="{{ theme_asset('css/pic_list.css') }}">
    <link rel="stylesheet" href="{{ theme_asset('css/pic_block.css') }}">
    <link rel="stylesheet" href="{{ theme_asset('css/basic.css') }}">
{% endblock head %}

{% block title %}{{ request.state.title }}{% endblock title %}

{% block content %}
    <h2 class="sound_only">최신글</h2>
    <div class="latest_top_wr">
      {{ render_latest_posts(request, 'main_list', 'notice', 4, 23)|safe }}
  </div>
....

@kagla
Copy link
Contributor Author

kagla commented Jan 12, 2024

최신글을 불러오는 방식들 (함수, include, import (macro))은 독립적인 실행방식이기 때문에 상위 블럭에 접근할 수 없습니다. 그러므로 main_list.html에서 직접 태그에 style태그를 넣을 수는 없습니다.

render되는 파일에서는 직접 style태그를 사용하는 것을 지양하고 css파일로 적용하는 것을 권장해야 할거 같습니다.

index.html

{% extends "base.html" %}

<!-- 여기에서 하위 렌더링 파일의 css를 추가한다.  -->
{% block head %}
    <link rel="stylesheet" href="{{ theme_asset('css/main_list.css') }}">
    <link rel="stylesheet" href="{{ theme_asset('css/pic_list.css') }}">
    <link rel="stylesheet" href="{{ theme_asset('css/pic_block.css') }}">
    <link rel="stylesheet" href="{{ theme_asset('css/basic.css') }}">
{% endblock head %}

{% block title %}{{ request.state.title }}{% endblock title %}

{% block content %}
    <h2 class="sound_only">최신글</h2>
    <div class="latest_top_wr">
      {{ render_latest_posts(request, 'main_list', 'notice', 4, 23)|safe }}
  </div>
....

고정된 css 파일은 이런 방식도 좋은데
추가 되는 css 파일을 읽어 올 수 있는 방법이 필요해요.

@kagla
Copy link
Contributor Author

kagla commented Jan 12, 2024

해당하는 style 태그 부분들만 따로 html file로 뽑아서 taeho/latest/main_list.html이랑 base.html의 head tag 안에 각각 {% include %} 로 넣는건 어떨까요?

코드로 보여주세요. ^^

@Junanjunan
Copy link
Contributor

@kagla

3592eaf

예시코드 작성한 커밋 링크입니다

@kagla
Copy link
Contributor Author

kagla commented Jan 12, 2024

@Junanjunan 괜찮네요. ^^

다음주에 @KimTom89 팀장과 함께 논의합시다.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feature New feature or request
Projects
None yet
Development

No branches or pull requests

4 participants