質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
CMS

CMS(Content Management System)は複数のユーザーでコンテンツを編集することが可能なWebサイトの管理/構築用のプラットフォームを指します。また、会社単位で運用管理するものはECMと呼びます。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Bootstrap

BootstrapはウェブサイトデザインやUIのWebアプリケーションを素早く 作成する可能なCSSフレームワークです。 Twitter風のデザインを作成することができます。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

1回答

297閲覧

XOOPS上のTinyDモジュールへのBootstrapの組み込み方

seastar3

総合スコア2285

CMS

CMS(Content Management System)は複数のユーザーでコンテンツを編集することが可能なWebサイトの管理/構築用のプラットフォームを指します。また、会社単位で運用管理するものはECMと呼びます。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Bootstrap

BootstrapはウェブサイトデザインやUIのWebアプリケーションを素早く 作成する可能なCSSフレームワークです。 Twitter風のデザインを作成することができます。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

0クリップ

投稿2018/09/23 05:22

少々古い技術のことで恐縮ですが、CMSのXOOPS2.0上のTinyD1モジュールでBootstrapのcarouselを表示するためのリンクの指定が分かりません。このTinyD1のどのフォルダのどのファイルのどの位置に

php

1<link rel="stylesheet" href="bootstrap.min.css" /> 2 3<script src="jquery.min.js" /></script> 4<script src="bootstrap.min.js" /></script>

等を書き込めばコンテンツ内でBootstrapが働くのか、ご存じの方はお教え下さい。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

m.ts10806

2018/09/23 05:53

そもそも「どこに設置したらいいか」は検討ついているのでしょうか?XOOPSにBootstrapをあてる方法は結構出回っているとは思うのですが、出回っている方法ではカバーできませんか?「試したこと」あれば具体的に記載してください(今のところちょっと丸投げ感あるので)
seastar3

2018/09/23 06:02

とりあえずWordPressモジュールについては、header.phpに組み込み動作させることができました。TinyDについては、Xoopsのコンテンツの編集画面上のHTMLヘッダのテキストボックスに書き込んでも、コンテンツで反応してくれません。ネットで検索しても、TinyDでのCSS関係の情報が出てこないので質問した次第です。
m.ts10806

2018/09/23 06:05

コンテンツ編集画面ではあくまで文字列が登録されるだけですしhtmlエスケープされるので効果はでません。phpファイルから画面を描画するファイルにあたりをつけて挿入するしかないと思います。
m.ts10806

2018/09/23 06:08

しかしTinyDだけに当てたいとなると、モジュールアップデートのときに差分アップデートを手動でしなきゃいけなかったように思いますが、そのあたりはどうでしょうか。あまりモジュール単体にCSSフレームワークをあてるといった要件は見ないので、なぜそうしたいのかを聞きたいです。それによって別のアドバイスも可能になるかもしれません。
seastar3

2018/09/23 06:09

コンテンツ編集画面ではじかれるのは心得ています。その上部のHTMLヘッダ枠があるのです。そこでも無理なので、TinyDモジュールでのBootstrapのリンク先ファイルを質問した次第です。
m.ts10806

2018/09/23 06:10

実際に各種ファイルは参照な場所に置いて、そのリンクパスを書いたんですよね?CDNでもダメでしたか?
seastar3

2018/09/23 06:13

モジュールレベルでリンクしたい理由は、モジュールがすでに10以上存在し、過去のモジュールに影響を与えたくないのと、各コンテンツの表示速度に影響が出るのを組み込むのに避けたいからです。Bootstrapを組み込み済みのWordpressは文字や枠の体裁が変化してしまいました。
seastar3

2018/09/23 06:14

ですから、既に動作しているWordpressモジュールはあります。TinyDのフォルダ構成等の情報に詳しい方に教えていただきたいと存じます。
m.ts10806

2018/09/23 06:18

Xoopsの質問なのになぜWordPressの話で押されるのかよくわかりません。質問内に一度も出てきていないような。タグにもありませんし。もし関係あるのでしたら関係性や環境情報として質問本文に追記しておいてください。XoopsとWordpress ですと、概念も構成もまるで違います。
seastar3

2018/09/23 07:33

Xoopsの質問ではなく、TinyDの質問です。Xoops内のモジュールとして動作しています。mts10806さんのコメントには「モジュールアップデートのときには・・」と出てきますが、TinyDはサポートが終了しているので、アップデートの配慮は不要です。私としても率先してXoopsのモジュールを保守しているのではなく、5年以上前から開設されているサイトの保守に携わることになったので取り扱っているものです。TinyDに関して実際的なアドバイスがあればよろしくお願いいたします。
m.ts10806

2018/09/23 07:40

なるほど。私がXoopsで制作してたときはほとんどpicoに移行してた時だったのでモジュールアップデートの懸念を残してました。失礼しました。ただ、Xoopsに組み込まれている機能の話なのでXoopsのことを無視して話は進められないのではとは思います。私も気にはなっているので少し検証はしてみますが、仰っている通りもうだいぶ昔に開発終了しているモジュールである上に、teratailにタグのないXOOPSの話なので、即決につながる回答が得られるかというと微妙かもしれません。もしかしたら私のように自身の環境に作って検証するような人もいるかもしれません。
seastar3

2018/09/23 07:58

mts10806さん、わざわざご検証いただけるようで、ありがとうございます。恐縮いたしております。私なりに現行のサイトを破壊しないように気をつけながら、index.html等のファイルを編集したりしつつうまくいくか試していきます。mts10806さんもご負担にならない程度で御指南をお願いいたします。
m.ts10806

2018/09/23 07:59

ご丁寧にありがとうございます。少し調べてみた感じ、開発終了したものの導入はできるようなのでホッとしてます。
guest

回答1

0

ローカル環境に導入していろいろと確認をしてみました。あくまで中間報告的な内容になります・・・。

私が確認したバージョンはXOOPS CUBE 2.2です。
TinyDは最終バージョンのものを利用しています。

私のローカルのMySQLのバージョンが比較的新しいもののため、TinyDで導入されているSQLとの整合性を調整していたら時間かかってしまいましたが・・・

手っ取り早く確認するためBootstrap最新のCDNを導入しました。

書く場所は「HTML header 」で間違いはなさそうです。<head></head>内に記述した読み込みコードは挿入できました。
ただし、XOOPS自体にデフォルトでjQueryが導入されており、それと競合してうまく動かないみたいですね。
私が確認したXOOPSではjQuery1.8でした。

で、これは設定ファイルで定義されているようで、
インストールフォルダ\html\modules\legacyRender\xoops_version.phpに書かれているようです。

ここまではいけたのですが、
上述の通りXOOPS本体に導入されているファイルとの競合であるため、TinyDの記事単体で済む問題ではないということが分かりました。
つまり、XOOPS本体に導入されているファイルということは、XOOPS本体または別のモジュールとの兼ね合いで、TinyDだけのためにXOOPS本体で読み込まれているファイルを無効にはできないということですね。

少し探した感じだとBootStrapで作られたテーマを利用するという記事も見つけましたが、うまくやってるんでしょうか。

では、「そのjQueryのバージョンで使えるBootstrapを導入しては」という案が出てくるのですが、
そのBootstrapにCarouselがそもそも入っているかという問題があります。
Bootstrap4は最低でも1.9.1が必要のようですね。

Bootstrap's JavaScript requires at least jQuery v1.9.1 but less than v4.0.0

「XOOPS本体のjQueryをアップグレードしては」というケースも考えられますが、
そこは導入してみないとわからないところではありますね。バージョンの違いによりXOOPS本体で使っているjQueryの記述が使用できなくなる可能性もなくはないです。

いずれにしてもXOOPS本体へのテコ入れが必要となるのは間違いなさそうです。

投稿2018/09/23 12:31

編集2018/09/23 12:32
m.ts10806

総合スコア80765

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

seastar3

2018/09/27 03:37

mts10806さん、わざわざ操作していただきながら、お返事が遅くなり申し訳ありません。当方なりに現場のファイルを少しずつ操作しておりました。 jQueryが重複する問題やヘッダ枠の操作などのアドバイスを参考にあれこれやってみましたが、スタイルタグも反応しないし、内容枠に無理に書き込んでもサニタイズされるしで、うまくいっていません。 やり方を変えて、Bootstrap設定入りの素直なhtmlファイルを準備し、iframeタグで流し込むことを考えています。今のところこのやり方でBootstrapの表示はできるようになりましたので、表示枠の大きさやCarouselの設定を合わせていきます。 また進展があれば自己回答することにして、まずはお礼を申し上げます。
m.ts10806

2018/09/28 05:07

> スタイルタグも反応しないし 簡単に下記を入れても効きませんか? <style> body{ background-color:#000; } </style> iframeでするとCMSの管理からか外れてしまうので、CMSの機能が使えないとか何かの時に不便なところも出てくるかもしれませんが、それしかないなら仕方ないですね・・。 Carouselだけで良かったらBootStrapからも出してjQueryプラグイン使うという手もありそうには思いました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問