Design Customize

SharePoint Online サイトの拡張ヘッダーを使ってデザインしてみよう

SharePointOnlineのモダンサイトには、いつからか利用できるヘッダーとして「拡張」レイアウトが追加されました。この拡張ヘッダーを利用することで、サイトに対してちょっと華やかなイメージを与えることができます。そんな拡張ヘッダーを設定するときのコツや注意点をまとめながら書き留めておこうと思います。なお、この記事はOffice365AdventCalendar2021の13日目です。毎年参加しているアドベントカレンダーですが、今年は25日まで毎日いろいろな方が記事を紹介...

2021.12.13

SharePoint Online

SharePoint Online モダンサイトに独自のテーマを設定する

SharePointOnlineでは、Office365グループに接続されたチームサイトや、今年登場したコミュニケーションサイトなど、「モダンサイト」と呼ばれる新しいSharePointのサイトがあります。（従来のサイトは「クラシックサイト」と呼ばれるようになりました）このモダンサイトを利用する場合でも、やはりサイトの色使いとして企業のブランドカラーを反映させたいななどと思われる方もいるかと思います。こうしたテーマ（色合い）は、モダンサイトにアクセスした状態で「歯車アイコン」...

2017.10.25

BrandingPowerShellSharePoint Online

SharePoint Online モダンページのページヘッダーを非表示にする

SharePointOnlineでは新しい「モダンページ」が利用可能となっており、先日もBingマップなどの新たなWebパーツも追加されました。NewwebpartsforyourmoderncommunicationsinSharePointOnlineこの新しいモダンページは、作成済みのサイトにも追加できます。手順は、下記の記事の通りです。SharePointOnlineのチームサイトのホームを”新しい”UIのページへ変更するただ、このモダンページには「ページヘッダー」が...

2017.02.02

SharePoint Online

SharePoint 2013

SharePoint Online のトップリンクバーのデザインを CSS で変更する

SharePointOnlineで簡単なポータルサイトやチームサイトを作りデザインを含め手を入れていくと、多くの場合ナビゲーションのデザインも変更したくなります（よね？）ただ、そこまで大きな改修は行いたくないし…と言った場合、CSSを使うだけでも簡単に雰囲気を変えることができます。そろそろ今年も本格的な夏を迎えることですし、SharePointのサイトデザインもちょっとだけ変更して気分を変えたいところです。CSSを使ってスタイルを適用するために必要な要素のIdやClassを毎...

2016.07.12

SharePoint 2013SharePoint 2016SharePoint Online

SharePoint 2013

代替 CSS の設定を JavaScript で行う

前回の投稿でも出てきましたが、SharePointのデザインをカスタマイズする際には「代替CSS」を設定することがあります。しかしながら、この「代替CSS」のGUIでの設定は「デザインマネージャー」に含まれており、「発行機能」を有効化したサイトでしか行えません。ただし、発行機能を有効化していないサイトでもAPIを利用することで設定が可能なようでしたので、お手軽なJavaScriptObjectModel(JSOM)を利用して設定する方法を試してみました。

2015.07.15

SharePoint 2013SharePoint Online

SharePoint Online のデザインカスタマイズを考える

SharePointOnlineはクラウドサービスです。そのため、日々サーバー側でのバグフィックスや機能改善などが行われています。それらは、ユーザーインタフェースの部分に関することもあり、サイトの見た目に関わるデザインをカスタマイズしていた場合、大きな影響を受けることもあります。こうしたデザインカスタマイズについて扱ったセッションがIgnite2015にもありましたので、その内容を追いながらデザインカスタマイズについて考えたいと思います。DeepDiveintoSafeSha...

2015.07.08

SharePoint 2013SharePoint Online

予定表 Web パーツのカレンダー表示をコンパクトにしてみた

SharePointのチームサイトで利用される機会も多い「予定表」ですが、ページ上にWebパーツを配置するとその大きさに驚かれる方も多いと思います。SharePoint2013になってから、少し小さくなった気もするのですが、それでも大きいですよね。そこで今回は、Webパーツをコンパクトに表示するカスタマイズを紹介したいと思います。

2013.06.26

BrandingJavaScriptSharePoint 2013SharePoint OnlineStyleSheet

Japan SharePoint Group#9 と第5回 Office 365 勉強会で登壇しました。

5月18日（土）のJapanSharePointGroupと6月19日（水）のOffice365勉強会でそれぞれ登壇させて頂きましたので、報告と記録を兼ねてブログに記載します。JapanSharePointGroup#9第5回Office365勉強会

2013.06.23

Japan SharePoint GroupOffice 365 User Group

SharePoint 2013 左上の製品ロゴを変更する

SharePoint2013では画面デザインが変更され、標準では青を基調とした比較的シンプルなデザインとなっています。また、常に表示される画面上部の青いバー（スイートバー）の一番左側に製品名「SharePoint」が表示されています。この製品名を企業名・団体名やロゴ画像へ変更したいというご要望は多くありそうなので、その一つの方法をご紹介します。なお、今回ご紹介する方法は、PowerShellを用いて行う方法となっており、現在のところオンプレミス版のみで実施可能です。

2013.05.02

BrandingSharePoint 2013

SharePoint Color Palette Tool を使ってみた

SharePoint2013のデザインを変えたいなーと思い調べていると、MicrosoftDownloadCenterで非常に有益そうなツールが公開されていましたので試してみました。ツールのダウンロードは下記URLから行えます。まだ英語版しかありませんが、簡単に利用できるツールになっています。SharePointColorPaletteTool

2013.04.26

BrandingSharePoint 2013SharePoint Online