# テンプレートのフォントを変更する方法

**URL:** <https://forum.onecomme.com/t/topic/150>\
**Category:** 質問\
**Created:** [2022 年 4 月 17 日午前 1:07 UTC](https://forum.onecomme.com/t/topic/150 "2022-04-17T01:07:59Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![ryo0427](https://yyz1.discourse-cdn.com/flex031/user_avatar/forum.onecomme.com/ryo0427/32/97_2.png) [@ryo0427](https://forum.onecomme.com/u/ryo0427)\
**Post date:** [2022 年 4 月 17 日午前 1:08 UTC](https://forum.onecomme.com/t/topic/150/1 "2022-04-17T01:08:00Z")

</div>

対象: わんコメ  
表示画面: OBS  
利用OS: Windows  
利用バージョン: 3.0.0-beta.11  
過去ログ確認: 『フォント』で検索してみました  
ドキュメント確認: した  
内容:

> **[Notion – The all-in-one workspace for your notes, tasks, wikis, and databases.](https://onecomme.notion.site/72cee7cebf714cec8105388c923c47ed)**
>
> A new tool that blends your everyday work apps into one. It's the all-in-one workspace for you and your team

以前から上記URLを確認しながらフォント変更を試しているのですがフォントが反映されません。

使用テンプレート名：line

カスタムCSS内容  
■□─━─━─━─━─━─━─━─━─━─━─━─━─━─━─━─□■

@import url（‘[https://fonts.googleapis.com/css2？family](https://fonts.googleapis.com/css2%EF%BC%9Ffamily) = RocknRoll + One＆ display = swap’）;

/\* テンプレカスタム ここから \*/

@import “…/\_\_origin/css/direction/bottom-to-top.css”;

.avatar { display: block; }

.name { display: none; }

.avatar { min-width: 30px; width: 30px; height: 30px; }

.comment-text { font-size: 20px; } .comment-text img { width: 20px; }

.name { font-size: 22px; }

.comment { margin: -8px 0; }

.comment-body { padding-top: 8px; padding-bottom: 8px; }

.comment-body { padding-left: 14px; padding-right: 14px; }

:root { --lcv-name-color: rgba(0, 0, 0, 1); }

:root { --lcv-text-color: rgba(0,0,0,1); }

:root { --lcv-background-color: rgba(255,150,80,1); }

:root { --lcv-name-shadow: var(–lcv-name-shadow-1); }

:root { --lcv-comment-shadow: var(–lcv-comment-shadow-0); }

:root { --lcv-comment-shadow-color: rgba(255, 255, 255, 1); }

/\* テンプレカスタム ここまで \*/

body { font-family：‘RocknRoll One’、sans-serif; background-color: rgba(0, 0, 0, 0); margin: 0px auto; overflow: hidden; }

■□─━─━─━─━─━─━─━─━─━─━─━─━─━─━─━─□■

CSS初心者なのでご教授いただけるとありがたいです。  
よろしくお願いいたします。

---

<div class="post-metadata">

**Author:** ![ASTIE](https://yyz1.discourse-cdn.com/flex031/user_avatar/forum.onecomme.com/astie/32/58_2.png) [@ASTIE](https://forum.onecomme.com/u/ASTIE)\
**Post date:** [2022 年 4 月 17 日午前 1:18 UTC](https://forum.onecomme.com/t/topic/150/2 "2022-04-17T01:18:44Z")

</div>

![image](https://canada1.discourse-cdn.com/flex031/uploads/onecomme/original/1X/2dc1ba2e02c2bb77844df5394cc0f8af18ff7450.png)  
CSS等を貼り付ける際は投稿時に\</\>を押すとコード専用の記述が追加されて下記のように読みやすくなります！

```auto
@import url('https://fonts.googleapis.com/css2?family=RocknRoll+One&display=swap');

/* テンプレカスタム ここから */

@import "…/__origin/css/direction/bottom-to-top.css";

.avatar { display: block; }

.name { display: none; }

.avatar { min-width: 30px; width: 30px; height: 30px; }

.comment-text { font-size: 20px; } .comment-text img { width: 20px; }

.name { font-size: 22px; }

.comment { margin: -8px 0; }

.comment-body { padding-top: 8px; padding-bottom: 8px; }

.comment-body { padding-left: 14px; padding-right: 14px; }

:root { --lcv-name-color: rgba(0, 0, 0, 1); }

:root { --lcv-text-color: rgba(0,0,0,1); }

:root { --lcv-background-color: rgba(255,150,80,1); }

:root { --lcv-name-shadow: var(–lcv-name-shadow-1); }

:root { --lcv-comment-shadow: var(–lcv-comment-shadow-0); }

:root { --lcv-comment-shadow-color: rgba(255, 255, 255, 1); }

/* テンプレカスタム ここまで */

body { font-family: 'RocknRoll One', sans-serif; background-color: rgba(0, 0, 0, 0); margin: 0px auto; overflow: hidden; }

```

フォーラムの仕様上そのまま貼り付けると一部表記が変わってしまうため、おそらくという回答になりますが、

> font-family：‘RocknRoll One’、sans-serif

「,」であるところが全角「、」になっているせいではないかなと思います  
先程貼り付けたCSSではフォントが変更されたのを確認できたので、合わせてご確認ください

---

<div class="post-metadata">

**Author:** ![ryo0427](https://yyz1.discourse-cdn.com/flex031/user_avatar/forum.onecomme.com/ryo0427/32/97_2.png) [@ryo0427](https://forum.onecomme.com/u/ryo0427)\
**Post date:** [2022 年 4 月 17 日午前 1:45 UTC](https://forum.onecomme.com/t/topic/150/3 "2022-04-17T01:45:15Z")

</div>

> [@ASTIE](#):
>
> `body { font-family: 'RocknRoll One', sans-serif; background-color: rgba(0, 0, 0, 0); margin: 0px auto; overflow: hidden; }`

CSSの貼り付け方、ありがとうございます！  
今後はそちらの機能を使って投稿させていただきますね！

そして質問の方への回答もありがとうございます！  
CSSの記述が全角になっているというご指摘を受け、もしかしてと思って調べてみたのですが、Google Fontsのサイトが自動翻訳されており、CSSの色んな部分が全角表記になっていました…。  
翻訳機能をオフにし、改めてコードを貼り直したら解決することが出来ました。

あまりにも初歩的なことなので質問も出来ずにずっと放置していたのですが、まさか翻訳機能のせいとは思いもしなかったです…。  
解決していただき、本当にありがとうございました！

---

<div class="post-metadata">

**Author:** ![ASTIE](https://yyz1.discourse-cdn.com/flex031/user_avatar/forum.onecomme.com/astie/32/58_2.png) [@ASTIE](https://forum.onecomme.com/u/ASTIE)\
**Post date:** [2022 年 4 月 17 日午後 10:17 UTC](https://forum.onecomme.com/t/topic/150/4 "2022-04-17T22:17:17Z")

</div>

クローズされました: 2022 年 4 月 17 日午後 10:17 UTC