Submit Search
Upload
デザインが統一されているShare point サイトを作成しよう
•
7 likes
•
21,113 views
Mayuko Hatanaka
Follow
2013/10/12 Japan SharePoint Group 勉強会 11# 福岡 発表資料です。
Read less
Read more
Technology
Report
Share
Report
Share
1 of 25
Download now
Download to read offline
Recommended
SharePoint モダン ポータル 徹底解説 !
SharePoint モダン ポータル 徹底解説 !
Ai Hirano
カッコいい SharePoint モダンサイトを作ろう
カッコいい SharePoint モダンサイトを作ろう
Hirofumi Ota
SharePoint Online モダンサイトの設計 - SharePoint の利用計画 - #MSInteract19 #PR05
SharePoint Online モダンサイトの設計 - SharePoint の利用計画 - #MSInteract19 #PR05
Hirofumi Ota
SharePoint Online で最近の困った。 大きなリストのお話。
SharePoint Online で最近の困った。 大きなリストのお話。
Hirofumi Ota
SharePoint Online で、ポータル実践アイデア
SharePoint Online で、ポータル実践アイデア
Hirofumi Ota
[SharePoint Online / OneDrive for Business] 効果的なファイル共有
[SharePoint Online / OneDrive for Business] 効果的なファイル共有
Ai Hirano
SharePoint 開発でできること 2019年9月版
SharePoint 開発でできること 2019年9月版
Hiroaki Oikawa
Viva Connections 拡張機能入門
Viva Connections 拡張機能入門
Hiroaki Oikawa
Recommended
SharePoint モダン ポータル 徹底解説 !
SharePoint モダン ポータル 徹底解説 !
Ai Hirano
カッコいい SharePoint モダンサイトを作ろう
カッコいい SharePoint モダンサイトを作ろう
Hirofumi Ota
SharePoint Online モダンサイトの設計 - SharePoint の利用計画 - #MSInteract19 #PR05
SharePoint Online モダンサイトの設計 - SharePoint の利用計画 - #MSInteract19 #PR05
Hirofumi Ota
SharePoint Online で最近の困った。 大きなリストのお話。
SharePoint Online で最近の困った。 大きなリストのお話。
Hirofumi Ota
SharePoint Online で、ポータル実践アイデア
SharePoint Online で、ポータル実践アイデア
Hirofumi Ota
[SharePoint Online / OneDrive for Business] 効果的なファイル共有
[SharePoint Online / OneDrive for Business] 効果的なファイル共有
Ai Hirano
SharePoint 開発でできること 2019年9月版
SharePoint 開発でできること 2019年9月版
Hiroaki Oikawa
Viva Connections 拡張機能入門
Viva Connections 拡張機能入門
Hiroaki Oikawa
SharePoint モダンポータル 2021年アップデートと最新のファイル管理方法
SharePoint モダンポータル 2021年アップデートと最新のファイル管理方法
Ai Hirano
SharePoint Online 外部共有を考える
SharePoint Online 外部共有を考える
Teruchika Yamada
Salesforceの標準オブジェクトについて復習してみた
Salesforceの標準オブジェクトについて復習してみた
y-maeda
よく聞くけど、「SharePoint リストの 5,000 件問題」ってなんなの?
よく聞くけど、「SharePoint リストの 5,000 件問題」ってなんなの?
Hirofumi Ota
情報共有ツールの使い分けの考え方とアプローチ
情報共有ツールの使い分けの考え方とアプローチ
日本マイクロソフト株式会社
Microsoft 365 を使い、よりよい業務環境の在り方と仕事への向き合い方を考えよう
Microsoft 365 を使い、よりよい業務環境の在り方と仕事への向き合い方を考えよう
Ai Hirano
いまさら聞けないselectあれこれ
いまさら聞けないselectあれこれ
lestrrat
DXとかDevOpsとかのなんかいい感じのやつ 富士通TechLive
DXとかDevOpsとかのなんかいい感じのやつ 富士通TechLive
Tokoroten Nakayama
インセプションデッキの紹介
インセプションデッキの紹介
lita
【istyle Data Talk #01】失敗から学ぶ!@cosmeを変えるデータ基盤のめざしどころ
【istyle Data Talk #01】失敗から学ぶ!@cosmeを変えるデータ基盤のめざしどころ
Hitomi Kakizaki
Amazon Redshift パフォーマンスチューニングテクニックと最新アップデート
Amazon Redshift パフォーマンスチューニングテクニックと最新アップデート
Amazon Web Services Japan
[db tech showcase Tokyo 2017] E21: InfluxDB+αで時系列データの異常検知を可視化してみた by 株式会社インサイ...
[db tech showcase Tokyo 2017] E21: InfluxDB+αで時系列データの異常検知を可視化してみた by 株式会社インサイ...
Insight Technology, Inc.
40歳過ぎてもエンジニアでいるためにやっていること
40歳過ぎてもエンジニアでいるためにやっていること
onozaty
なぜ初心者は webpackが解らないのか?- Why can’t you understand the webpack? -
なぜ初心者は webpackが解らないのか?- Why can’t you understand the webpack? -
健人 井関
メタデータのファイルの管理
メタデータのファイルの管理
Sylvain Gantois
SharePoint Online へのアクセスを制限しよう
SharePoint Online へのアクセスを制限しよう
Hirofumi Ota
Cassandraのしくみ データの読み書き編
Cassandraのしくみ データの読み書き編
Yuki Morishita
多様な働き⽅のチームでどうやって アジャイルにやるの?(雁行陣開発)
多様な働き⽅のチームでどうやって アジャイルにやるの?(雁行陣開発)
toshihiro ichitani
SharePoint Framework の最新情報をキャッチアップしよう!
SharePoint Framework の最新情報をキャッチアップしよう!
Ai Hirano
まじめに!できる!LT
まじめに!できる!LT
Akabane Hiroyuki
PHPとフロントのイイ関係・動くスタイルガイドをつくろう
PHPとフロントのイイ関係・動くスタイルガイドをつくろう
Yusuke Kawabata
Share point 小ネタ集
Share point 小ネタ集
Mayuko Hatanaka
More Related Content
What's hot
SharePoint モダンポータル 2021年アップデートと最新のファイル管理方法
SharePoint モダンポータル 2021年アップデートと最新のファイル管理方法
Ai Hirano
SharePoint Online 外部共有を考える
SharePoint Online 外部共有を考える
Teruchika Yamada
Salesforceの標準オブジェクトについて復習してみた
Salesforceの標準オブジェクトについて復習してみた
y-maeda
よく聞くけど、「SharePoint リストの 5,000 件問題」ってなんなの?
よく聞くけど、「SharePoint リストの 5,000 件問題」ってなんなの?
Hirofumi Ota
情報共有ツールの使い分けの考え方とアプローチ
情報共有ツールの使い分けの考え方とアプローチ
日本マイクロソフト株式会社
Microsoft 365 を使い、よりよい業務環境の在り方と仕事への向き合い方を考えよう
Microsoft 365 を使い、よりよい業務環境の在り方と仕事への向き合い方を考えよう
Ai Hirano
いまさら聞けないselectあれこれ
いまさら聞けないselectあれこれ
lestrrat
DXとかDevOpsとかのなんかいい感じのやつ 富士通TechLive
DXとかDevOpsとかのなんかいい感じのやつ 富士通TechLive
Tokoroten Nakayama
インセプションデッキの紹介
インセプションデッキの紹介
lita
【istyle Data Talk #01】失敗から学ぶ!@cosmeを変えるデータ基盤のめざしどころ
【istyle Data Talk #01】失敗から学ぶ!@cosmeを変えるデータ基盤のめざしどころ
Hitomi Kakizaki
Amazon Redshift パフォーマンスチューニングテクニックと最新アップデート
Amazon Redshift パフォーマンスチューニングテクニックと最新アップデート
Amazon Web Services Japan
[db tech showcase Tokyo 2017] E21: InfluxDB+αで時系列データの異常検知を可視化してみた by 株式会社インサイ...
[db tech showcase Tokyo 2017] E21: InfluxDB+αで時系列データの異常検知を可視化してみた by 株式会社インサイ...
Insight Technology, Inc.
40歳過ぎてもエンジニアでいるためにやっていること
40歳過ぎてもエンジニアでいるためにやっていること
onozaty
なぜ初心者は webpackが解らないのか?- Why can’t you understand the webpack? -
なぜ初心者は webpackが解らないのか?- Why can’t you understand the webpack? -
健人 井関
メタデータのファイルの管理
メタデータのファイルの管理
Sylvain Gantois
SharePoint Online へのアクセスを制限しよう
SharePoint Online へのアクセスを制限しよう
Hirofumi Ota
Cassandraのしくみ データの読み書き編
Cassandraのしくみ データの読み書き編
Yuki Morishita
多様な働き⽅のチームでどうやって アジャイルにやるの?(雁行陣開発)
多様な働き⽅のチームでどうやって アジャイルにやるの?(雁行陣開発)
toshihiro ichitani
SharePoint Framework の最新情報をキャッチアップしよう!
SharePoint Framework の最新情報をキャッチアップしよう!
Ai Hirano
まじめに!できる!LT
まじめに!できる!LT
Akabane Hiroyuki
What's hot
(20)
SharePoint モダンポータル 2021年アップデートと最新のファイル管理方法
SharePoint モダンポータル 2021年アップデートと最新のファイル管理方法
SharePoint Online 外部共有を考える
SharePoint Online 外部共有を考える
Salesforceの標準オブジェクトについて復習してみた
Salesforceの標準オブジェクトについて復習してみた
よく聞くけど、「SharePoint リストの 5,000 件問題」ってなんなの?
よく聞くけど、「SharePoint リストの 5,000 件問題」ってなんなの?
情報共有ツールの使い分けの考え方とアプローチ
情報共有ツールの使い分けの考え方とアプローチ
Microsoft 365 を使い、よりよい業務環境の在り方と仕事への向き合い方を考えよう
Microsoft 365 を使い、よりよい業務環境の在り方と仕事への向き合い方を考えよう
いまさら聞けないselectあれこれ
いまさら聞けないselectあれこれ
DXとかDevOpsとかのなんかいい感じのやつ 富士通TechLive
DXとかDevOpsとかのなんかいい感じのやつ 富士通TechLive
インセプションデッキの紹介
インセプションデッキの紹介
【istyle Data Talk #01】失敗から学ぶ!@cosmeを変えるデータ基盤のめざしどころ
【istyle Data Talk #01】失敗から学ぶ!@cosmeを変えるデータ基盤のめざしどころ
Amazon Redshift パフォーマンスチューニングテクニックと最新アップデート
Amazon Redshift パフォーマンスチューニングテクニックと最新アップデート
[db tech showcase Tokyo 2017] E21: InfluxDB+αで時系列データの異常検知を可視化してみた by 株式会社インサイ...
[db tech showcase Tokyo 2017] E21: InfluxDB+αで時系列データの異常検知を可視化してみた by 株式会社インサイ...
40歳過ぎてもエンジニアでいるためにやっていること
40歳過ぎてもエンジニアでいるためにやっていること
なぜ初心者は webpackが解らないのか?- Why can’t you understand the webpack? -
なぜ初心者は webpackが解らないのか?- Why can’t you understand the webpack? -
メタデータのファイルの管理
メタデータのファイルの管理
SharePoint Online へのアクセスを制限しよう
SharePoint Online へのアクセスを制限しよう
Cassandraのしくみ データの読み書き編
Cassandraのしくみ データの読み書き編
多様な働き⽅のチームでどうやって アジャイルにやるの?(雁行陣開発)
多様な働き⽅のチームでどうやって アジャイルにやるの?(雁行陣開発)
SharePoint Framework の最新情報をキャッチアップしよう!
SharePoint Framework の最新情報をキャッチアップしよう!
まじめに!できる!LT
まじめに!できる!LT
Similar to デザインが統一されているShare point サイトを作成しよう
PHPとフロントのイイ関係・動くスタイルガイドをつくろう
PHPとフロントのイイ関係・動くスタイルガイドをつくろう
Yusuke Kawabata
Share point 小ネタ集
Share point 小ネタ集
Mayuko Hatanaka
20141213 jpsps
20141213 jpsps
Atsuo Yamasaki
エンジニアのためのUser Centered Designの考え方(入門編)
エンジニアのためのUser Centered Designの考え方(入門編)
Katsumi Tazuke
Webサイト入門
Webサイト入門
touhou
Web制作者は変化についていけるか? 変化についていくべきか?
Web制作者は変化についていけるか? 変化についていくべきか?
masaaki komori
わんくま同盟 大阪勉強会 #46
わんくま同盟 大阪勉強会 #46
Atsuo Yamasaki
静的HTMLファイルをWordPressのテーマにするワークショップ
静的HTMLファイルをWordPressのテーマにするワークショップ
masaya yamao
うちの開発におけるXD利用法
うちの開発におけるXD利用法
Kazuma Sekiguchi
ON HTML5 FIELD で書き尽くせなかったこと
ON HTML5 FIELD で書き尽くせなかったこと
Masakazu Muraoka
60分でわかるレスポンシブWebデザイン[セミナー資料]
60分でわかるレスポンシブWebデザイン[セミナー資料]
Daisuke Yamazaki
CSSフレームワークとCMS+RWDテンプレでレスポンシブWebデザインサイトを構築しよう
CSSフレームワークとCMS+RWDテンプレでレスポンシブWebデザインサイトを構築しよう
Masayuki Abe
知っておきたい「Web制作イマドキの注目ポイント」
知っておきたい「Web制作イマドキの注目ポイント」
Mori Kazue
運用まで見越したWeb CMS導入のチェックポイント[効率化] Webマスター必見!
運用まで見越したWeb CMS導入のチェックポイント[効率化] Webマスター必見!
FatWireKK
ニフティセミナー資料 最初にやっておくべき!内部SEO4つの基本対策
ニフティセミナー資料 最初にやっておくべき!内部SEO4つの基本対策
ニフティ株式会社
Sharegate Migration のご紹介
Sharegate Migration のご紹介
Kazuhiko Nakamura
企業文化をサービスデザインスタイルに
企業文化をサービスデザインスタイルに
Recruit Technologies
SharePoint 開発入門
SharePoint 開発入門
Hiroaki Oikawa
インタラクティブクリエイターズ会社概要 201204glbl
インタラクティブクリエイターズ会社概要 201204glbl
Interactive Creators Tokyo
HTML5 for IA
HTML5 for IA
Atsushi HASEGAWA, Ph.D.
Similar to デザインが統一されているShare point サイトを作成しよう
(20)
PHPとフロントのイイ関係・動くスタイルガイドをつくろう
PHPとフロントのイイ関係・動くスタイルガイドをつくろう
Share point 小ネタ集
Share point 小ネタ集
20141213 jpsps
20141213 jpsps
エンジニアのためのUser Centered Designの考え方(入門編)
エンジニアのためのUser Centered Designの考え方(入門編)
Webサイト入門
Webサイト入門
Web制作者は変化についていけるか? 変化についていくべきか?
Web制作者は変化についていけるか? 変化についていくべきか?
わんくま同盟 大阪勉強会 #46
わんくま同盟 大阪勉強会 #46
静的HTMLファイルをWordPressのテーマにするワークショップ
静的HTMLファイルをWordPressのテーマにするワークショップ
うちの開発におけるXD利用法
うちの開発におけるXD利用法
ON HTML5 FIELD で書き尽くせなかったこと
ON HTML5 FIELD で書き尽くせなかったこと
60分でわかるレスポンシブWebデザイン[セミナー資料]
60分でわかるレスポンシブWebデザイン[セミナー資料]
CSSフレームワークとCMS+RWDテンプレでレスポンシブWebデザインサイトを構築しよう
CSSフレームワークとCMS+RWDテンプレでレスポンシブWebデザインサイトを構築しよう
知っておきたい「Web制作イマドキの注目ポイント」
知っておきたい「Web制作イマドキの注目ポイント」
運用まで見越したWeb CMS導入のチェックポイント[効率化] Webマスター必見!
運用まで見越したWeb CMS導入のチェックポイント[効率化] Webマスター必見!
ニフティセミナー資料 最初にやっておくべき!内部SEO4つの基本対策
ニフティセミナー資料 最初にやっておくべき!内部SEO4つの基本対策
Sharegate Migration のご紹介
Sharegate Migration のご紹介
企業文化をサービスデザインスタイルに
企業文化をサービスデザインスタイルに
SharePoint 開発入門
SharePoint 開発入門
インタラクティブクリエイターズ会社概要 201204glbl
インタラクティブクリエイターズ会社概要 201204glbl
HTML5 for IA
HTML5 for IA
Recently uploaded
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
Toru Tamaki
Utilizing Ballerina for Cloud Native Integrations
Utilizing Ballerina for Cloud Native Integrations
WSO2
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
Toru Tamaki
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
iPride Co., Ltd.
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
atsushi061452
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
sn679259
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
CRI Japan, Inc.
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
CRI Japan, Inc.
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
iPride Co., Ltd.
新人研修 後半 2024/04/26の勉強会で発表されたものです。
新人研修 後半 2024/04/26の勉強会で発表されたものです。
iPride Co., Ltd.
Recently uploaded
(10)
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
Utilizing Ballerina for Cloud Native Integrations
Utilizing Ballerina for Cloud Native Integrations
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
新人研修 後半 2024/04/26の勉強会で発表されたものです。
新人研修 後半 2024/04/26の勉強会で発表されたものです。
デザインが統一されているShare point サイトを作成しよう
1.
デザインが統一されている SharePoint サイトを作成しよう HTML とCSS
でSharePoint のデザインを変更する アドバンスド・ソリューション(株) 畑中 真由子
2.
アジェンダ • 自己紹介 • 対象ユーザー •
HTML で作成するページ – HTML を作成するには? • デザインマネージャー – デザインマネージャーとは – デザインマネージャーで出来ること • デザインパッケージ – デザインパッケージとは – デザインパッケージの構成要素 • デザインの変更 – マスターページの作成と適用 – デザインパッケージの作成 • デザインの展開 – デザインパッケージの再利用 – デザインパッケージの展開 • まとめ
3.
自己紹介 • 畑中 真由子 •
アドバンスド・ソリューション株式会社 所属 – http://www.advanced-solution.jp/ • 前職でMicrosoft Office SharePoint Server 2007 サイト構築やNotes移行、サポート デスクなどを行っており、その経験を活かし現在は主に SharePoint Server 2010 、 SharePoint Server 2013 のオンプレミス、オンライン両方のサイト設計やサイト構築など アプリ系を担当 Blogを書いています。なるべくユーザー目線で「かゆいところに手が届く」を目指し日々投稿 させてい頂いております。まだ記事は少ないですが、どんどん投稿していきますので宜しくお願 い致します。 Office365とSharePointのブログ http://o365sharepoint.wordpress.com/
4.
突然ですが・・・
5.
こんな悩みありませんか? • 社内ポータルサイトがあるけど、各自で設定しているので デザインに統一感がない…。 • 企業イメージが伝わるデザインにしたい! •
SharePoint の簡素な外観はイヤ! では、デザインを変えてみましょう!
6.
デザイン変更って言われても… • どうやって変更するの? • どうやってデザインを展開するの? •
どうせ敷居高いでしょ? HTMLとCSSで出来ます! 展開はデザインマネージャー にお任せあれ! 敷居は少し高いけど、前バージョンよりは簡単になったかな(苦笑)。
7.
SharePoint Server 2013
デザインの要 その1 HTMLとCSS HTML とCSSでSharePoint ページの元となるファイルを、 SharePoint ページの作成しましょう。 その2 デザインマネージャー HTML ファイルをSharePoint のマスターページに変換します。 その3 デザインパッケージ マスターページやスタイルを1つにまとめて他のサイトに再利用しましょ う。
8.
HTML で作成する SharePoint
2013 のページ デザインの要 ~その1~
9.
HTML ファイルを作成するには? • 任意のWebページエディターもしくはテキストエディターな どを用意します。 Webページエディター
テキストエディタ
10.
★補足★ SharePoint のページ •
SharePoint のページは、主に3つの要素から構成されい ます。覚えておくとHTML 作成時にサイトの全体観がつ かめます。 要素 説明 マスターページ サイトのすべてのページの共有部分の要素 ヘッダー、フッダー、サイトのロゴ、サイトのタイトル、トップナビ ゲーション、検索ボックスなどを配置する ページレイアウト ページの本文のレイアウトや構造を定義(Web パーツ領域の追 加など) ページ(コンテンツ) Web パーツ領域にWeb パーツを追加する マスターページ マスターページ ページ レイアウト ページ SharePoint のページ 参考資料 SharePoint 2013 ページ モデルの概要 http://msdn.microsoft.com/ja-jp/library/jj191506.aspx
11.
デザインマネージャー デザインの要 ~その2~
12.
デザインマネージャーとは • SharePoint 全般のデザイン(マスターページ、ページレイアウ ト、テーマ、デバイスチャンネルなど)の設定を行ったり、作成 するSharePoint
Server 2013 からの発行機能の新機能で す。 詳細についてはMSDNをご確認下さい。 SharePoint 2013 のデザイン マネージャーの概要 http://msdn.microsoft.com/JA-JP/library/jj822363.aspx
13.
デザインマネージャーで出来ること? 1. HTMLファイルをマスターページファイル(.master)に変換 することができます。 2. iPhone・iPad・Androidなどからサイトを表示する際のデ ザインが指定できます。 3.
ページレイアウトのHTML ファイルを作成することができ ます。 4. サイトコレクションに展開するマスターページの発行、設 定ができます。 5. デザインパッケージの作成ができます。
14.
デザインパッケージ デザインの要 ~その3~
15.
• SharePoint サイトコレクションの視覚デザインをデザイン マネージャーによってSharePoint
ソリューションパッケージ (.wsp ファイル)としてまとめたものです。 詳細についてはMSDNをご確認下さい。 SharePoint Server 2013 のデザイン パッケージの概要 http://msdn.microsoft.com/ja-jp/library/jj862342.aspx デザインパッケージとは SharePoint ソリューションパッケージ 変換 デザインマネージャー 視覚デザイン
16.
デザインパッケージの構成要素 マスターページ(サイトコレクション全体的なデザイン) ページレイアウト(Webパーツ領域を構成しているもの) テーマ(サイト背景色などのページ要素の色を決定する) スタイルシート(文章のレイアウトの情報) Java Script ファイル(動的に反応するWebページ) 画像(サイトに表示するロゴや背景、アイコンの画像) デバイスチャンネル(各種デバイスへのデザインの設定) サイト列(複数のリストに割り当てることのできる、再利用可能な列) コンテンツタイプ(ページ
コンテンツ タイプから継承されるコンテンツ タイプ) デザイン パッケージ
17.
• わかったけど、どうやってマスターページやデザインパッケー ジを作成するの? SharePoint のデザインに関しての説明は 以上です! では、SharePoint
のデザインの 変更と展開をしてみましょう!
18.
デザインの変更 さっそくデザインを変更してみましょう!
19.
マスターページの作成、発行、設定 1. HTML、CSSでSharePoint ページの元になるデザイン を作成します。 2.
「マスターページギャラリー」にHTML とCSS をアップロー ドします。(フォルダーでまとめておくと便利です。) 3. デザインマネージャーでHTML をマスターページとして発 行します。 4. SharePoint のスニペットをHTML に張り付けます。 5. サイト マスターページの設定で発行したマスターページ を既定の値に設定します。
20.
デザインパッケージの作成 1. サイトコレクションに接続し「サイトの設定」を開きます。 2. 「デザインマネージャー」を選択します。 3.
「デザインパッケージの作成」をクリック。 4. 任意のデザイン名を入力し「作成」をクリックすると「ただ いま処理中です…」と表示されます。 5. デザインパッケージ作成画面に戻ると「パッケージを準備 できました。ダウンロードするには、ここをクリックします。」 と表示されると作成完了です。
21.
★補足★ ページ作成のコツ • 「<div
data- name=“ContentPlaceHolderMain”> …</div>」を任意の場所に配置するとページコ ンテンツを好きな場所に表示できます。 • ダイアログにロゴなどを表示したくない場合は 「<header class=“ms-dialogHidden”> <!—the rest of the header--> </ header >」を任意の場所に追加すると表示さ れません。
22.
デザインの展開 作成したデザインを他のサイトでも利用しましょう!
23.
デザインパッケージの再利用 1. デザインを作成したサイトコレクションに接続します。 2. 「サイトの設定」より「ソリューション」をクリック。 3.
作成したデザインパッケージ名をクリック。 4. 確認のダイアログが表示されるので「保存」をクリックでエ クスポート完了です。
24.
デザインパッケージの展開 1. デザインを適用したいサイトコレクションに接続します。 2. 「サイトの設定」の「デザインマネージャー」をクリック。 3.
「完成しているデザイン パッケージをインポートする」をク リックします。 4. 保存したデザインパッケージを選択しインポートをクリック します。 5. デザインパッケージが展開されます。
25.
まとめ • WebデザイナーやHTML とCSS
の知識がある人だけでも サイトのデザインをすることが可能になりました。 • HTMLとCSS、デザインマネージャー、デザインパッケージ がサイトデザインの要になります。 • デザインパッケージで様々なサイトに容易にデザインを適 用できるようになりました。 これで今日からカッ コいいサイトがつく れるね!
Download now