آموزش شبکه و برنامه‌نویسی

با ما بروز باشید

شیرپوینت را قورت دهید ویرایش دوم - ایجاد Masterpage در شیرپوینت 2016 (درس هجدهم)

ایجاد Masterpage در شیرپوینت 2016 

همان‌طور که از پیش گفتیم، شیرپوینت به صورت پیش فرض، دارای دو Masterpage با نام‌های Seattle و oslo است که هر کدام دارای قالب خاصّی هستند، در این قسمت می‌خواهیم یک صفحه‌ی جدید به عنوان Masterpage انتخاب کنیم و بر روی شیرپوینت فعّال کنیم.

برای شروع کار باید ابزار SharePoint Server Publishing را فعّال کنید تا بتوانید یک صفحه‌ی جدید را به عنوان صفحه‌ی اصلی خود در نظر بگیرید، وارد سایت شیرپوینتی خود شوید و بر روی Site Settings کلیک کنید.

 

در این صفحه از قسمت Site Actions، گزینه‌ی Manage Site features را انتخاب کنید.

 در این صفحه، Feature‌های مختلف مربوط به سایت را مشاهده می‌کنید، برای فعّال کردن SharePoint Server Publishing بر روی Active کلیک کنید.

 اگر Feature مورد نظر فعّال شد که مشکلی نیست، اگر چنانچه با اخطار زیر مواجه شدید باید به صورت زیر عمل کنید.

 وارد سرور شیرپوینت شوید و سرویس SharePoint 2016 Management Shell را با کاربر Administrator فعّال کنید، بعد از آن دستور زیر را اجرا کنید.

stsadm –o activatefeature –id cod –url “http://sp2016” -force

در دستور بالا به جای Cod باید همان شماره‎‌ای را که در شکل بالایی با رنگ سبز مشخّص کردیم را وارد کنید و بر روی Enter فشار دهید، با این کار Feture مورد نظر فعّال خواهد شد؛ در شکل زیر  بعد از فعّال کردن دستور بالا، Feature مورد نظر را اجرا کردیم.

 بعد از فعّال شدن Feature باید صفحه‌ی مورد نظر خود را که می‌خواهید به عنوان MasterPage کار کند را در شیرپوینت آپلود کنید، برای آپلود کردن فایل چند راهکار وجود دارد، یکی اینکه از خود SharePoint Designer برای این کار استفاده کنید، در شکل زیر  پوشه‌ی New-Web که حاوی صفحه‌ی سایت جدید است، در قسمت MasterPage قرار داده شده است.

 

 روش دیگر این است که یک درایو تحت شبکه برای پوشه‌ی Master Page ایجاد کنید، برای این کار مثلاً در ویندوز 7 وارد My computer شوید و بر روی Map networks drive کلیک کنید.

 

 

در این صفحه و در قسمت Folder، آدرس پوشه‌ی MasterPage را وارد کنید و بر روی OK کلیک کنید، با این کار یک درایو ایجاد می‌شود که می‌توانید فایل خود را در آن قرار دهید.

  همان‌طور که مشاهده می‌کنید، به محلّ پوشه‌ی MasterPage متّصل شدیم که در این قسمت به راحتی می-توانیم فایل مورد نظر خود را کپی کنیم.

بعد از اینکه صفحه‌ی مورد نظر خود را آپلود کردیم باید آن صفحه را به عنوان صفحه‌ی MasterPage در نظر بگیریم که این کار را در ادامه، انجام خواهیم داد.

به مانند شکل زیر وارد Site Settings شوید.

 

از قسمت Look and Feel بر روی گزینه‌ی Design Manager کلیک کنید.

 

 

در این صفحه از سمت چپ بر روی Edit Master Pages کلیک کنید، اگر به دقّت نگاه کنید، دو صفحه‌ی oslo و seattle را مشاهده می‎‌کنید که به صورت پیش‌فرض در لیست تعریف شده¬اند، برای اینکه بخواهید صفحه‌ی دلخواه خود را به لیست اضافه کنید بر روی Convert an HTML file to a SharePoint master page کلیک کنید تا صفحه‌ی HTML معمولی به صفحه‌ی MAsterPage تغییر حالت دهد.

 

 در این صفحه وارد پوشه‌ی New-Web که قبلاً آپلود کردیم، شوید و فایل Index.html را انتخاب و بر روی Insert کلیک کنید.

 

 فایل Index به عنوان صفحه‌ی MasterPage به لیست اضافه شده است، حال باید این صفحه را بر روی سایت شیرپوینت فعّال کنید.

 

 وارد SharePoint Designer شوید و به آدرس صفحه‌ی آپلود ‌شده مراجعه کنید، همان‌طور که مشاهده می‌کنید همه‌ی فایل‌ها به جز، فایل HTML مخفی شده و یک فایل با نام Index.master اضافه شده است، بر روی آن کلیک راست کنید و گزینه‌یSet a Default Master Page را انتخاب کنید، با این کار صفحه‌ی شما به عنوان صفحه‌ی Master Page انتخاب خواهد شد.

 

 در شکل زیر  صفحه‌ی شیرپوینت را مشاهده می‌کنید که کاملاً تغییر کرده است؛ این صفحه همیشه ثابت خواهد بود، مثلاً اگر بخواهید وارد تنظیمات شیرپوینت شوید، همه‌ی تنظیمات زیر این صفحه نشان داده خواهد شد که در شکل زیر  این موضوع را مشاهده می‌کنید؛ بهتر است صفحاتی که برای Master Page شدن، طرّاحی می‌شوند مرتّب باشند، مثلاً می‌توانید از یک نوار دارای منو استفاده کنید تا کلّ اطّلاعات سایت را معرّفی کند.

 

  

 را معرّفی کند.

تذکّر: عنوان Master Page کردن یک صفحه با عنوان Home Page کردن صفحه، کاملاً متفاوت است؛  Master Pageکردن یک صفحه باعث می‌شود که آن صفحه در بالای همه‌ی صفحات دیگر بماند و ثابت باشد، امّا Home Page کردن صفحه، فقط مربوط به صفحه‌ی اوّل است.

حال اگر بخواهید به عقب برگردید و از صفحه‌ی Master پیش‌فرض استفاده کنید باید واردMaster Page شوید و بر روی Seattle.master کلیک راست   کنید و گزینه‌یSet as Default Master Page را انتخاب کنید، با این کار به صفحه‌ی پیش‌فرض شیرپوینت برخواهید گشت.

 

 پاک کردن نوار عنوان، لوگو و جستجو

با کمی دقّت و تمرکز بر روی صفحات شیرپوینتی می‌توانید آن‌ها را ویرایش کنید؛ برای این کار، سایت شیرپوینتی خود را ترجیحاً در مرورگر FireFox باز کنید و بر روی کلید F12 فشار دهید.

در شکل زیر، سایت شیرپوینتی باز شده است، با فشار دکمه‌ی F12، تب زیری مربوط به مرورگر باز می‌شود بر روی آیکون شماره‌ی یک کلیک کنید و بر روی قسمتی که در صفحه مشخّص شده، کلیک کنید؛ در ادامه در نوار زیری، کد مربوط به آن انتخاب می‌شود، کلمه‎‌ای که در قسمت ID انتخاب شده را کپی بگیرید، منظور، کلمه‌ی "s4-titlerow" است.

 

 بعد از کپی گرفتن کلمه‌ی مورد نظر وارد SharePoint Designer شوید و از سمت چپ بر روی Master Pages کلیک کنید، در این صفحه باید بر رویMaster Page فعّال خود، کلیک راست کنید و گزینه‎‌‌یEdit File in Advanced Mode را انتخاب کنید.

 

 در شکل زیر  کد‌های مربوط به صفحه‌ی شیرپوینتی خود را مشاهده می‌کنید، بر روی کلید ترکیبی CTRL + F فشار دهید و کلمه‌ی s4-titlerow را جستجو کنید، بعد از پیدا کردن بر روی آن کلیک راست  کنید و گزینه‌یSelect Tag را فشار دهید، بعد از انتخاب مجموعة مورد نظر آن را پاک کنید و صفحه را ذخیره کنید.

 

 همان‌طور که در شکل زیر مشاهده می‌کنید، نوار مورد نظر از صفحه حذف شده است، می‌توانید با دستکاری بقیّة کدها، طرّاحی مورد نظر خود را شکل دهید.

 

 تذکّر: اگر بخواهید کد مربوط به نوار سیاه رنگی بالای سایت را از صفحه حذف کنید، دیگر سایت اجرا نخواهد شد؛ همیشه این صفحه باید در بالای همه‌ی صفحات سایت‌های شیرپوینتی باشد.

حال اگر بخواهید، Style نوار بالایی سایت شیرپوینت را تغییر دهید، چه کاری باید انجام دهید؟

برای این کار باید به روش قبلی، style مربوط به قسمت مورد نظر را از طریق F12 مربوط به مرورگر پیدا کنید و کار خود را بر روی آن انجام دهید، برای بررسی این موضوع به صفحه‌ی بعد توجّه کنید.

در شکل زیر از طریق ابزار Debug مرورگر، نام ID نوار بالایی سایت شیرپوینت را پیدا کردیم، در قسمت پایین و در سمت راست صفحه، نام Style مشخّص شده است؛ SuiteNav.css نام این فایل است، بر روی آن کلیک کنید.

 

 در این صفحه، اطّلاعات فایل SuiteNav.css را مشاهده می‌کنید، برای اینکه تغییرات خود را در فایل انجام دهید باید به فایل مورد نظر دسترسی داشته باشید، برای این کار بر روی عنوان فایل کلیک راست  کنید و گزینه‌ی Copy link address کلیک کنید.

آدرس فایل به صورت زیر است:

http://sp2016/_layouts/15/1033/styles/SuiteNav.css

برای اینکه به پوشه‌ی فایل مورد نظر دسترسی داشته باشید، بهتر است یک Map Drive ایجاد کنید و پوشه‌ی مورد نظر را به سیستم اضافه کنید.

 

 وارد My Computer شوید و بر رویMap Network drive کلیک کنید.

 

 در شکل پایین، آدرس زیر را وارد کنید:

\\sp2016\c$\Program Files\Common Files\microsoft shared\Web Server Extensions\16\TEMPLATE\LAYOUTS

در آدرس بالا، به جای Sp2016 باید آدرس سرور خود را وارد کنید، بعد از وارد کردن اطّلاعات بر روی Finish کلیک کنید.

 

 

برای پیدا کردن فایل SUITENAV.CSS وارد پوشه‌ی 1033 و بعد، وارد STYLES شوید؛ در شکل زیر  فایل مورد نظر پیدا شده است، در ادامه تغییراتی را در فایل اعمال خواهیم کرد و نتیجه‌ی کار را مشاهده می‌کنید.

 

اگر بخواهید رنگ نوار بالایی را به رنگ دیگری تغییر دهید باید کد را به صورت زیر تغییر دهید.

 

 

فایل SUITENAV.CSS را باز ‌کنید و به ID با نام o365cs-base.o365cs-topnavBGColor-2 مراجعه کنید؛ در این قسمت که در شکل زیر  مشخّص شده است، رنگ Background-color را به رنگ Green تغییر ‌دهید و فایل را با کلیک بر روی CTRL + S ذخیره ‌کنید.

 

همان‌طور که مشاهده می‌کنید، نوار به رنگ سبز تغییر حالت داده است.

 

برای ایجاد تغییرات دیگر، مثلاً زمانی‌که مأوس خود را بر روی آیکون زیر  قرار می‌دهید، رنگ آن به رنگ دلخواه تغییر می‌کند، برای این کار به ادامه توجّه کنید.

  

در کد CSS مورد نظر، در قسمت نام .o365cs-base .ms-bgc-tdr,.o365cs-base .ms-bgc-tdr-h:hover رنگ مورد نظر را تغییر دهید و صفحه را ذخیره کنید.

 

با قرار دادن مأوس بر روی آیکون مورد نظر، رنگ پشت‌زمینه‌ی آن تغییر کرده است، البتّه با این تغییر، آیکون‌های سمت راست نیز به همین شکل تغییر خواهند کرد.

 

برای تغییر نوشته‌ای که در نوار نوشته شده است باید ویژگی های ‌ID مشخّص‌شده در شکل زیر  را تغییر دهید.

 

در شکل زیر  تغییرات اعمال شده است و نوشته¬ها به رنگ و فونت متفاوت تغییر حالت. دادند.

 

برای تغییر رنگ منو و فونت‌های آن به صورت زیر عمل ‌کنید و ID و نام فایل CSS آن را پیدا وتغییرات خود را در آن اعمال ‌کنید.

 

 

 

 

 در آدرس مشخّص‌شده، فایل SUITENAV.CSS را پیدا و آن را باز کنید.

در قسمت کد‌ها، ID مربوط به منو را پیدا کنید و تغییرات خود را بر روی آن، اعمال و صفحه را ذخیره کنید.

 

 

همان‌طور که در شکل مشاهده می‌کنید، رنگ منوی مورد نظر تغییر کرده است و بردار دور آن نیز برداشته شده است.

این کارها، یک¬سری از توانایی‌هایی است که می¬توانید صفحه‌ی شیرپوینتی خود را به شکل دلخواه تغییر دهید.

تذکّر: زمانی‌که نوار بالای سایت را تغییر می‌دهید، این نوار در قسمت مدیریّتی شیرپوینت تغییر خواهد کرد، در شکل زیر این موضوع را مشاهده می‌کنید.

 

 

 شیرپوینت را قورت دهید ویرایش دوم - بررسی کلی سرور‌ها (درس اول)

شیرپوینت را قورت دهید ویرایش دوم - راه اندازی سرور دیتابیس (درس دوم)

شیرپوینت را قورت دهید ویرایش دوم - راه اندازی سرور شیرپوینت (درس سوم)

شیرپوینت را قورت دهید ویرایش دوم - کار با سایت ها و لیست ها در شیرپوینت (درس چهارم)

شیرپوینت را قورت دهید ویرایش دوم - فیلتر کردن و گروه بندی در لیست‌ها (درس پنجم)

شیرپوینت را قورت دهید ویرایش دوم - ایجاد نما (View) در شیرپوینت (درس ششم)

شیرپوینت را قورت دهید ویرایش دوم - کار با Task (وظایف) در شیرپوینت (درس هفتم)

شیرپوینت را قورت دهید ویرایش دوم - ایجاد Template از لیست شیرپوینت (درس هشتم)

شیرپوینت را قورت دهید ویرایش دوم - کار با ستون Lookup در شیرپوینت(درس نهم)

شیرپوینت را قورت دهید ویرایش دوم -کار با InfoPath در شیرپوینت (درس دهم)

شیرپوینت را قورت دهید ویرایش دوم - ایجاد شرط در InfoPath (درس یازدهم)

شیرپوینت را قورت دهید ویرایش دوم - دریافت اطّلاعات لیست دیگر در فرم Infopath (درس دوازدهم)

شیرپوینت را قورت دهید ویرایش دوم -کار با نرم‌افزار SharePoint Designer (درس سیزدهم)

شیرپوینت را قورت دهید ویرایش دوم - فعّال‌سازی ایمیل در شیرپوینت (درس چهاردهم)

شیرپوینت را قورت دهید ویرایش دوم - امنیّت در شیرپوینت 2016 (درس پانزدهم)

شیرپوینت را قورت دهید ویرایش دوم - طرّاحی در شیرپوینت 2016 (درس شانزدهم)

شیرپوینت را قورت دهید ویرایش دوم - کار با کدهای HTML و CSS در صفحات (درس هفدهم)

شیرپوینت را قورت دهید ویرایش دوم - ایجاد Masterpage در شیرپوینت 2016 (درس هجدهم)

نوشتن دیدگاه


تصویر امنیتی
تصویر امنیتی جدید

آخرین مطالب سایت

Search