Jump to content

Как сдвинуть влево заголовок и текст статьи?

alexbavar

By alexbavar
in Invision Community Support

 Share

Recommended Posts

alexbavar Contributor

alexbavar

Posted
Posted

Подскажите, кто разбирается, как передвинуть заголовок и текст статьи влево?

Код:

Спойлер

{{if !empty( $records ) }}
    {{foreach $records as $record}}
            <div class='ArticleS1'>
<article class='{{if $record->hidden()}}ipsModerated{{endif}}'>
     <div class="record-image">
        {{if $record->record_image}}
              {{if $record->isFutureDate() || $record->mapped('pinned') || $record->mapped('featured')}}
                <div class="badges">
                    {{if $record->mapped('pinned')}}
                        <span data-ipsTooltip title='{lang="pinned"}'>{lang="pinned"}</span>
                    {{endif}}
                    {{if $record->mapped('featured') and $record->mapped('pinned')}}
                        <span> / </span>
                    {{endif}}
                    {{if $record->mapped('featured')}}
                        <span data-ipsTooltip title='{lang="featured"}'>{lang="featured"}</span>
                    {{endif}}
                </div>
            {{endif}}
              {{if $record::database()->options['reviews']}}
                  <div class="reviews">
                      {template="rating" app="core" params="'small', $record->averageReviewRating(), \IPS\Settings::i()->reviews_rating_out_of, $record->memberReviewRating()" group="global"}
              </div>
            {{endif}}
              {{if !$record->container()->disable_sharelinks}}
                <div class="Msharelinks">{template="sharelinks" app="core" group="global" params="$record"}</div>
            {{endif}}
                <a href="{$record->url()}" title="{lang="read_more_about" sprintf="$record->_title"}">
                    <img src="{file="$record->record_image" extension="cms_Records"}">
                 </a>
          {{endif}}
    </div>
      <div class="record-content">
          <h2 class='record-title ipsType_pageTitle'>
            {{if $record->hidden() === -1 || $record->hidden() === 1}}
                {{if $record->hidden() === -1}}
                    <span class="ipsBadge ipsBadge_icon ipsBadge_warning" data-ipsTooltip title='{$record->hiddenBlurb()}'><i class='fa fa-eye-slash'></i></span>
                {{elseif $record->hidden() === 1}}
                    <span class="ipsBadge ipsBadge_icon ipsBadge_warning" data-ipsTooltip title='{lang="pending_approval"}'><i class='fa fa-warning'></i></span>
                {{endif}}
            {{endif}}
            <a href="{$record->url()}" title="{lang="read_more_about" sprintf="$record->_title"}">
                {{if $record->unread()}}
                    <span class='ipsItemStatus' data-ipsTooltip title="{lang="cms_unread_record"}"><i class="fa fa-circle"></i></span>
                {{endif}}
                {$record->_title}
            </a>
        </h2>
        <div class='ipsDataItem_meta ipsType_normal ipsType_richText ipsType_break'>
            {{foreach $record->customFieldsForDisplay('listing') as $fieldId => $fieldValue}}
                {{if $fieldValue}}
                    {$fieldValue|raw}
                {{endif}}
            {{endforeach}}
        </div>
        <section class='ipsType_normal ipsType_richText ipsType_break' data-ipsTruncate data-ipsTruncate-size='3 lines' data-ipsTruncate-type='remove'>
            {$record->truncated()|raw}
        </section>
          {{if count( $record->tags() )}}
            {template="tags" group="global" app="core" params="$record->tags()"}
        {{endif}}
          <ul class="record-info">
            <li class="date"><i class="fa fa-calendar"></i>{datetime="$record->record_publish_date"}</li>
            <li class="user"><i class="fa fa-user"></i>{lang="byline_nodate" htmlsprintf="$record->author()->link()"}</li>
            {{if $record::database()->options['comments']}}<li class="comments"><i class="fa fa-comment"></i><a href='{$record->url()}#comments' title='{lang="view_comments"}'>{lang="num_comments" pluralize="$record->record_comments"}</a></li>{{endif}}
            <li class="views"><i class="fa fa-eye"></i>{lang="num_views_with_number" pluralize="$record->record_views"}</li>
              <li class="readmore"><i class="fa fa-plus"></i><a href="{$record->url()}" title="{lang="read_more_about" sprintf="$record->_title"}">Read More</a></li>
        </ul>
        
          {{if $record->record_image}} {{else}}
              {{if !$record->container()->disable_sharelinks}}
                <div class="Msharelinks">{template="sharelinks" app="core" group="global" params="$record"}</div>
            {{endif}}
          {{endif}}
      </div>
    </article>
</div>
    {{endforeach}}
{{endif}}

7.jpg

7.jpg

Link to comment
Share on other sites
Axeland Collaborator

Axeland

Posted
Posted

Правой кнопкой в google chrome на странице - посмотреть код.

Смотришь класс контейнера где располагается текст, например <p class="class"> или <div class="class">

Идешь в CSS темы, там ищешь этот класс или в самом низу дописываешь этот класс и затем свойствами css ставишь

.class { text-align:left }

Не работает - добавляешь .class { text-align:left !important}

Если не получится - не удивляйся, ты приложил скриншоты и исходный код из админки, тут даже программист/верстальщик не угадает (нужна телепатия) :)

Напиши в личку, помогу. :)

Link to comment
Share on other sites
alexbavar Contributor

alexbavar

Posted
  • Author
Posted
55 минут назад, Axeland сказал:

Правой кнопкой в google chrome на странице - посмотреть код.

Смотришь класс контейнера где располагается текст, например <p class="class"> или <div class="class">

Идешь в CSS темы, там ищешь этот класс или в самом низу дописываешь этот класс и затем свойствами css ставишь

.class { text-align:left }

Не работает - добавляешь .class { text-align:left !important}

Если не получится - не удивляйся, ты приложил скриншоты и исходный код из админки, тут даже программист/верстальщик не угадает (нужна телепатия) :)

Напиши в личку, помогу. :)

Не понял, от слова совсем

Заголовок: class="record-title ipsType_pageTitle">

Текст:  <section class="ipsType_normal ipsType_richText ipsType_break is-truncated" data-ipstruncate="" data-ipstruncate-size="3 lines" data-ipstruncate-type="remove" style="overflow-wrap: break-word;">

 

Link to comment
Share on other sites
alexbavar Contributor

alexbavar

Posted
  • Author
Posted
Только что, Silence сказал:

поставит в код class="left"

в <h2 >

и

в <div class='ipsDataItem_meta ipsType_normal ipsType_richText ipsType_break'>

:( не понял

Link to comment
Share on other sites
Axeland Collaborator

Axeland

Posted
Posted

Silence, в этом случае может поломаться форматирование. Автор, лучше добавьте класс left в уже имеющийся:  Заголовок: class="record-title ipsType_pageTitle left">

Текст:  <section class="ipsType_normal ipsType_richText ipsType_break is-truncated left" data-ipstruncate="" data-ipstruncate-size="3 lines" data-ipstruncate-type="remove" style="overflow-wrap: break-word;">

Если не получится, то как я ранее говорил, в стиль добавить:

Заголовок: class="record-title ipsType_pageTitle" style="text-align:left">

<section class="ipsType_normal ipsType_richText ipsType_break is-truncated" data-ipstruncate="" data-ipstruncate-size="3 lines" data-ipstruncate-type="remove" style="overflow-wrap: break-word; text-align:left">

 

 

Link to comment
Share on other sites
alexbavar Contributor

alexbavar

Posted
  • Author
Posted
24 минуты назад, Axeland сказал:

Silence, в этом случае может поломаться форматирование. Автор, лучше добавьте класс left в уже имеющийся:  Заголовок: class="record-title ipsType_pageTitle left">

Текст:  <section class="ipsType_normal ipsType_richText ipsType_break is-truncated left" data-ipstruncate="" data-ipstruncate-size="3 lines" data-ipstruncate-type="remove" style="overflow-wrap: break-word;">

Если не получится, то как я ранее говорил, в стиль добавить:

Заголовок: class="record-title ipsType_pageTitle" style="text-align:left">

<section class="ipsType_normal ipsType_richText ipsType_break is-truncated" data-ipstruncate="" data-ipstruncate-size="3 lines" data-ipstruncate-type="remove" style="overflow-wrap: break-word; text-align:left">

 

 

С заголовком получилось, а текст нет.

<section class='left ipsType_normal ipsType_richText ipsType_break' data-ipsTruncate data-ipsTruncate-size='3 lines' data-ipsTruncate-type='remove'>

Link to comment
Share on other sites
Axeland Collaborator

Axeland

Posted
Posted
Только что, alexbavar сказал:

С заголовком получилось, а текст нет.

<section class='left ipsType_normal ipsType_richText ipsType_break' data-ipsTruncate data-ipsTruncate-size='3 lines' data-ipsTruncate-type='remove'>

Попробуйте добавить класс именно в конец записи. Т.е.   class="ipsType_normal ipsType_richText ipsType_break is-truncated left" 

В этом случае этот класс становится "важнее", чем все остальные в классификаторе. Если в каком-то классе до left будет значение "text-align:center", например, то класс left его перебьет. И наоборот, естественно.

 

 

Link to comment
Share on other sites
alexbavar Contributor

alexbavar

Posted
  • Author
Posted
19 минут назад, Axeland сказал:

Попробуйте добавить класс именно в конец записи. Т.е.   class="ipsType_normal ipsType_richText ipsType_break is-truncated left" 

В этом случае этот класс становится "важнее", чем все остальные в классификаторе. Если в каком-то классе до left будет значение "text-align:center", например, то класс left его перебьет. И наоборот, естественно.

 

 

Не получилось

Link to comment
Share on other sites
Axeland Collaborator

Axeland

Posted
Posted
1 минуту назад, alexbavar сказал:

Не получилось

Тогда добавляйте  style="overflow-wrap: break-word; text-align:left", если не получится, то последнее средство (и самое неоднозначное):  style="overflow-wrap: break-word; text-align:left !important"

Это выставит приоритет для выравнивания текста именно этим свойством стиля, другие будут игнорироваться.

Link to comment
Share on other sites
alexbavar Contributor

alexbavar

Posted
  • Author
Posted
34 минуты назад, Axeland сказал:

Тогда добавляйте  style="overflow-wrap: break-word; text-align:left", если не получится, то последнее средство (и самое неоднозначное):  style="overflow-wrap: break-word; text-align:left !important"

Это выставит приоритет для выравнивания текста именно этим свойством стиля, другие будут игнорироваться.

Премного благодарен, заработало :)

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Ваша ссылка была автоматически строена.   Отображать как обычную ссылку

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...