ブログページでテキストを2段組にできない

WEBサイト制作
1

【環境情報】
・baserCMSのバージョン：4.7.5
・レンタルサーバー名：ロリポップ
・使用テーマ：bc_sample
・PHPスキル（自己評価）： E / 全くわからない

ブログのテキスト部分に「内容テンプレート」の「2段組テキスト」を使ったのですが、編集が2段組みにならず、保存をして確認しても2段組みになりません。
↓の様になってしまいます。

見出しを挿入します。

1段落目のテキストを挿入します。

2段落目のテキストを挿入します。

見出しを挿入します。

1段落目のテキストを挿入します。

2段落目のテキストを挿入します。

何処に問題があるんでしょうか？

2

確認したところ、テンプレート内に事前に用意されているいずれのサンプル（「画像（左）とテキスト」「画像（右）とテキスト」「テキスト２段組」）も、サンプル内で使われているクラスに対応したcssが、baserCMSに付属のどのテーマにも見当たりませんでした。
よって、利用したい「テキスト２段組」テンプレートに使われている

<div class="template-two-block"> 
<div class="block-left">
<div class="block-right">

などのクラスにfloat: left;やdispley:flex;といったレイアウト用のプロパティを適用させたcssを用意して、利用されてるテーマファイルのレイアウトファイルから呼び出すか、既存のcssファイル内に追記するかの対応をご自身でする必要があるようです。

単に右と左に分けるだけというのであれば、

.block-left {
float: left;
width: 50%; /* 必要なければ、削除。あるいは、適宜％指定 */
}

だけでも、<div class="block-right"> は右に回り込んで、２段になると思います。後は、どんなふうにレイアウトしたいかだと思いますので、ご自身でいろいろ試してみてください。

「いいね！」 1
3

私もエディタテンプレートを使おうとしたときにcssファイルをさがしました。
/vendor/baserproject/bc-admin-third/webroot/css/admin/ckeditorフォルダ内のcontents.cssのようです。
上記のファイルを（テーマフォルダ）/webroot/cssフォルダにコピーして，（テーマフォルダ）/templates/layout/default.phpで読み込むように設定すると使えるようになりました。

現在は，GUSSAN さまが書かれているdisplay:flex;を使ってオリジナルのテンプレートを作成して使っています。

4

4系をお使いの様なので。。。

5

@gihan さんの情報です。
以下が、対象のCSSの様です。

@charset "UTF-8";
/**
 * エディタのデフォルトCSS
 *
 * baserCMS :  Based Website Development Project <https://basercms.net>
 * Copyright (c) baserCMS Users Community <https://basercms.net/community/>
 *
 * @copyright       Copyright (c) baserCMS Users Community
 * @link			https://basercms.net baserCMS Project
 * @since           baserCMS v 2.0.0
 * @license         https://basercms.net/license/index.html
 */

body
{
	/* Font */
	font-family: Arial, Verdana, sans-serif;
	font-size: 16px;

	/* Text color */
	color: #222;

	/* Remove the background color to make it transparent */
	background: none;
	background-color: #fff;
}

ol,ul,dl
{
	/* IE7: reset rtl list margin. (#7334) */
	*margin-right:0px;
	/* preserved spaces for list items with text direction other than the list. (#6249,#8049)*/
    padding:0 40px;
}

.template-image-float-left .image {
	float:left;
	padding:0;
	margin:0 10px 10px 0;
	margin-right:10px;
	margin-bottom:10px;
}
.template-image-float-right .image {
	float:right;
	padding:0;
	margin:0 10px 10px 0;
	margin-left:10px;
	margin-bottom:10px;
}
.template-two-block .block-left {
	float:left;
	width:48%;
	padding-right:2%;
}
.template-two-block .block-right {
	float:right;
	width:48%;
	padding-left:2%;
}

/* clear
----------------------------------------------- */

.clear {
	clear:both;
}
.clearfix:after {
	content: " ";
	display: block;
	clear: both;
	height: 0;
}
.clearfix {
	display: inline-block;
}
.clearfix {
	display: block;
}
6

@GUSSAN さま
すみません。ご使用のバージョンを確認しておりませんでした。

7

gihanさま、GUSSANさま、早速のお返事ありがとうございます。
全くの初心者で、CSSの基本すら怪しい私です。ちなみに、BaserCMS使い始めて3日目の超初心者です。

CSSを色々探したのですが、

に対応するものが見つからず、途方に暮れておりました。 そもそも、無かったっとのことで、インストール間違えたとがかなくて、ホッとしております。

既存のCSSに追加するのが簡単かとは思いますが、どのCSSに書き加えるのがいいのか判断に迷います。

（テーマフォルダ）/webroot/cssフォルダにコピーとの助言いただきましたが、webrootフォルダが見つからない… orz
/theme/bc_sample/css/フォルダーで良いのでしょうか？

お二人には感謝です。

8

はい、そちら（/theme/bc_sample/css/）で大丈夫です。
baserCMSの4系と5系では、さまざまなファイルのパスがちがっていて、 @gihan さんのコメントに記載されていたパスは、5系のものだったため、見つからなかったのです。
ちなみに4系の場合は、/theme/admin-third/css/admin/ckeditor/contents.css の場所にあります。
上記のcontents.css ファイルを /theme/bc_sample/css/contents.css の位置にコピーし、/theme/bc_sample/Layouts/default.php の24行目辺り（変更されていなければ）記載されているCSSタグを出力する関数に以下の様に ‘contents’ を加えます。

	<?php $this->BcBaser->css([
		'style',
		'jquery-ui/jquery-ui-1.11.4',
		'colorbox/colorbox-1.6.1',
		'editor',
		'contents'
	]) ?>

以上で、cssが反映されるはずです。
頑張ってやってみてください。

9

ありがとうございます。頑張ってみます:bangbang:

10

ありがとうございました。解決いたしました。感謝:bangbang:

11

よかったです。

しかし、本来は、このCSSはユーザー側で作業しなくても、読み込まれていて然るべきものだと思うので、以前のいずれかのバージョンで見落とされてしまったのだと思います。

「いいね！」 1
12

@YOSHIBOO さま
解決できてよかったです。お使いのbaserCMSが4系であることを確認せずに5系の情報を流してしまい混乱させてしまいました。申し訳ありません。

「いいね！」 1