Перейти к содержанию

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


Рекомендуемые сообщения

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

Код:

Спойлер

{{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

Ссылка на комментарий
Поделиться на другие сайты

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

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

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

.class { text-align:left }

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

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

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

Ссылка на комментарий
Поделиться на другие сайты

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;">

 

Ссылка на комментарий
Поделиться на другие сайты

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

в <h2 >

и

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

Ссылка на комментарий
Поделиться на другие сайты

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

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

в <h2 >

и

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

:( не понял

Ссылка на комментарий
Поделиться на другие сайты

В ваш код .... что вы дали - измените <h2> на <h2 class="left"> и прочие

Ссылка на комментарий
Поделиться на другие сайты

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">

 

 

Ссылка на комментарий
Поделиться на другие сайты

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'>

Ссылка на комментарий
Поделиться на другие сайты

Только что, 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 его перебьет. И наоборот, естественно.

 

 

Ссылка на комментарий
Поделиться на другие сайты

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

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

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

 

 

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

Ссылка на комментарий
Поделиться на другие сайты

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

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

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

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

Ссылка на комментарий
Поделиться на другие сайты

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

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

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

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

Ссылка на комментарий
Поделиться на другие сайты

Присоединяйтесь к обсуждению

Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.
Примечание: Ваш пост будет проверен модератором, прежде чем станет видимым.

Гость
Ответить в этой теме...

×   Вставлено с форматированием.   Вставить как обычный текст

  Разрешено использовать не более 75 эмодзи.

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

×   Ваш предыдущий контент был восстановлен.   Очистить редактор

×   Вы не можете вставлять изображения напрямую. Загружайте или вставляйте изображения по ссылке.

  • Последние посетители   0 пользователей онлайн

    • Ни одного зарегистрированного пользователя не просматривает данную страницу
×
×
  • Создать...