<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>網站教學 &#8211; 鈞啟網路科技有限公司</title>
	<atom:link href="https://ibc.tw/blog/web-teaching/feed" rel="self" type="application/rss+xml" />
	<link>https://ibc.tw</link>
	<description></description>
	<lastBuildDate>Sun, 02 Mar 2025 22:41:33 +0000</lastBuildDate>
	<language>zh-TW</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=7.0</generator>

<image>
	<url>https://ibc.tw/wp-content/uploads/2018/09/cropped-ibclogo-1-32x32.png</url>
	<title>網站教學 &#8211; 鈞啟網路科技有限公司</title>
	<link>https://ibc.tw</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>Smart Slider 3外掛介紹</title>
		<link>https://ibc.tw/smart-slider-3-introduction</link>
		
		<dc:creator><![CDATA[weking]]></dc:creator>
		<pubDate>Wed, 23 Jan 2019 02:17:13 +0000</pubDate>
				<category><![CDATA[網誌]]></category>
		<category><![CDATA[網站教學]]></category>
		<guid isPermaLink="false">https://www.ibc.tw/?p=563</guid>

					<description><![CDATA[<p>過去使用過不少Slider 應用在部落格或網站上，不論是免費或付費的外掛，前陣子客戶網站原另一款Slider外</p>
<p>這篇文章 <a rel="nofollow" href="https://ibc.tw/smart-slider-3-introduction">Smart Slider 3外掛介紹</a> 最早出現於 <a rel="nofollow" href="https://ibc.tw">鈞啟網路科技有限公司</a>。</p>
]]></description>
										<content:encoded><![CDATA[<p><img fetchpriority="high" decoding="async" class="alignnone size-full wp-image-564" src="https://www.ibc.tw/wp-content/uploads/2019/01/ibc-p563-1.jpg" alt="Smart Slider 3免費版" width="1920" height="1080" srcset="https://ibc.tw/wp-content/uploads/2019/01/ibc-p563-1.jpg 1920w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p563-1-300x169.jpg 300w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p563-1-768x432.jpg 768w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p563-1-1024x576.jpg 1024w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p563-1-600x338.jpg 600w" sizes="(max-width: 1920px) 100vw, 1920px" />過去使用過不少Slider 應用在部落格或網站上，不論是免費或付費的外掛，前陣子客戶網站原另一款Slider外掛在上傳圖片時一直出現錯誤，雖然有上傳成功，在前台卻無法正常顯示，推測是外掛更新後造成，因此緊急更換為Smart Slider 3免費版，主要功能如下：</p>
<ul>
<li>輸入和輸出Slider</li>
<li>更直覺的建立幻燈片：例如選擇照片，再選擇文章或添加YouTube和Vimeo網址</li>
<li>靜態Slider</li>
<li>切換動畫：水平，垂直，淡入淡出</li>
<li>背景動畫</li>
<li>圖層：圖像，標題，文字，按鈕，Vimeo，YouTube</li>
<li>自適應圖層字體大小調整</li>
<li>依據不同設備隱藏特定圖層</li>
<li>滑動縮圖圖像</li>
</ul>
<p>目前語言版本有繁體中文，相信在操作設定上會更容易，更快上手。</p>
<blockquote class="wp-embedded-content" data-secret="1uxyClmPB1"><p><a href="https://tw.wordpress.org/plugins/smart-slider-3/" target="_blank" rel="noopener">Smart Slider 3</a></p></blockquote>
<p><iframe class="wp-embedded-content" sandbox="allow-scripts" security="restricted"  src="https://tw.wordpress.org/plugins/smart-slider-3/embed/#?secret=1uxyClmPB1" data-secret="1uxyClmPB1" width="600" height="338" title="「Smart Slider 3」 &#8212; Plugin Directory" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></iframe></p>
<p>這篇文章 <a rel="nofollow" href="https://ibc.tw/smart-slider-3-introduction">Smart Slider 3外掛介紹</a> 最早出現於 <a rel="nofollow" href="https://ibc.tw">鈞啟網路科技有限公司</a>。</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Loco Translate本地化主題和外掛</title>
		<link>https://ibc.tw/loco-translate-localization</link>
		
		<dc:creator><![CDATA[weking]]></dc:creator>
		<pubDate>Wed, 16 Jan 2019 02:45:33 +0000</pubDate>
				<category><![CDATA[網站教學]]></category>
		<guid isPermaLink="false">https://www.ibc.tw/?p=557</guid>

					<description><![CDATA[<p>通常在使用Wordpress時，會安裝許多外掛，這些外掛大部分是其他語系國家所編寫，不論是前端或後台皆是以英文</p>
<p>這篇文章 <a rel="nofollow" href="https://ibc.tw/loco-translate-localization">Loco Translate本地化主題和外掛</a> 最早出現於 <a rel="nofollow" href="https://ibc.tw">鈞啟網路科技有限公司</a>。</p>
]]></description>
										<content:encoded><![CDATA[<p><img decoding="async" class="wp-image-558 alignleft" src="https://www.ibc.tw/wp-content/uploads/2019/01/ibc-p557-1.jpg" alt="" width="562" height="316" srcset="https://ibc.tw/wp-content/uploads/2019/01/ibc-p557-1.jpg 1920w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p557-1-300x169.jpg 300w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p557-1-768x432.jpg 768w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p557-1-1024x576.jpg 1024w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p557-1-600x338.jpg 600w" sizes="(max-width: 562px) 100vw, 562px" /></p>
<p>通常在使用Wordpress時，會安裝許多外掛，這些外掛大部分是其他語系國家所編寫，不論是前端或後台皆是以英文呈現，這時就需要本地化的工具。</p>
<p>過去通常是使用Poedit，在本機進行翻譯後，再透過FTP上傳到主機中，對新手而言相形之下較為麻煩。</p>
<p>現在透過Loco Translate外掛，即可在後台進行編譯。</p>
<p>&nbsp;</p>
<p><img decoding="async" class="alignnone size-full wp-image-559" src="https://www.ibc.tw/wp-content/uploads/2019/01/ibc-p557-2.jpg" alt="" width="1920" height="1080" srcset="https://ibc.tw/wp-content/uploads/2019/01/ibc-p557-2.jpg 1920w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p557-2-300x169.jpg 300w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p557-2-768x432.jpg 768w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p557-2-1024x576.jpg 1024w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p557-2-600x338.jpg 600w" sizes="(max-width: 1920px) 100vw, 1920px" /></p>
<p>這篇文章 <a rel="nofollow" href="https://ibc.tw/loco-translate-localization">Loco Translate本地化主題和外掛</a> 最早出現於 <a rel="nofollow" href="https://ibc.tw">鈞啟網路科技有限公司</a>。</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>網站前台Cookie提示訊息設定</title>
		<link>https://ibc.tw/website-cookie-notice</link>
		
		<dc:creator><![CDATA[weking]]></dc:creator>
		<pubDate>Wed, 09 Jan 2019 03:58:52 +0000</pubDate>
				<category><![CDATA[網站教學]]></category>
		<category><![CDATA[網誌]]></category>
		<guid isPermaLink="false">https://www.ibc.tw/?p=547</guid>

					<description><![CDATA[<p>去(2018)年五月，歐盟開始實施GDPR一般資料保護規範，網站需主動告知使用者會使用Cookie，並說明其隱</p>
<p>這篇文章 <a rel="nofollow" href="https://ibc.tw/website-cookie-notice">網站前台Cookie提示訊息設定</a> 最早出現於 <a rel="nofollow" href="https://ibc.tw">鈞啟網路科技有限公司</a>。</p>
]]></description>
										<content:encoded><![CDATA[<p><img loading="lazy" decoding="async" class="wp-image-548 alignnone" src="https://www.ibc.tw/wp-content/uploads/2019/01/ibc-p547-1.jpg" alt="" width="636" height="358" srcset="https://ibc.tw/wp-content/uploads/2019/01/ibc-p547-1.jpg 1920w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p547-1-300x169.jpg 300w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p547-1-768x432.jpg 768w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p547-1-1024x576.jpg 1024w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p547-1-600x338.jpg 600w" sizes="(max-width: 636px) 100vw, 636px" /></p>
<p>去(2018)年五月，歐盟開始實施GDPR一般資料保護規範，網站需主動告知使用者會使用Cookie，並說明其隱私權政策，若您使用Wordpress架站，也有現成的外掛可供安裝使用，例如：<a href="https://wordpress.org/plugins/cookie-notice/" target="_blank" rel="noopener">https://wordpress.org/plugins/cookie-notice/</a></p>
<p><img loading="lazy" decoding="async" class="wp-image-549 alignnone" src="https://www.ibc.tw/wp-content/uploads/2019/01/ibc-p547-2.jpg" alt="" width="550" height="400" srcset="https://ibc.tw/wp-content/uploads/2019/01/ibc-p547-2.jpg 1014w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p547-2-300x218.jpg 300w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p547-2-768x558.jpg 768w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p547-2-600x436.jpg 600w" sizes="(max-width: 550px) 100vw, 550px" /></p>
<p>若你不想安裝太多外掛，也可以使用線上工具<a href="https://cookieconsent.insites.com/" target="_blank" rel="noopener">Cookie Consent</a>，產生一組Cookie Bar代碼貼入網站&lt;/head&gt;之前。</p>
<p>進入<a href="https://cookieconsent.insites.com/" target="_blank" rel="noopener">Cookie Consent</a>首頁，點擊Download，即可分別設定呈現位置、風格、自訂顏色、文字，隱私權政策頁面連結等，設定過程中還可預覽效果，並隨時調整，設定完成後複製代碼，在你的網站&lt;/head&gt;標籤前貼入此代碼即完成。</p>
<p><img loading="lazy" decoding="async" class="alignnone wp-image-550" src="https://www.ibc.tw/wp-content/uploads/2019/01/ibc-p547-3.jpg" alt="" width="521" height="927" srcset="https://ibc.tw/wp-content/uploads/2019/01/ibc-p547-3.jpg 1080w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p547-3-169x300.jpg 169w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p547-3-768x1365.jpg 768w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p547-3-576x1024.jpg 576w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p547-3-600x1067.jpg 600w" sizes="(max-width: 521px) 100vw, 521px" /></p>
<p>這篇文章 <a rel="nofollow" href="https://ibc.tw/website-cookie-notice">網站前台Cookie提示訊息設定</a> 最早出現於 <a rel="nofollow" href="https://ibc.tw">鈞啟網路科技有限公司</a>。</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>標題過長使用CSS文本溢出屬性</title>
		<link>https://ibc.tw/css-title-overflow</link>
		
		<dc:creator><![CDATA[weking]]></dc:creator>
		<pubDate>Tue, 08 Jan 2019 02:02:10 +0000</pubDate>
				<category><![CDATA[網站教學]]></category>
		<category><![CDATA[網誌]]></category>
		<guid isPermaLink="false">https://www.ibc.tw/?p=544</guid>

					<description><![CDATA[<p>在網頁設計上，有時為了排版好看，會將過長的標題省略，並以省略號(&#8230;)表示，省略號也表示節省原文或語</p>
<p>這篇文章 <a rel="nofollow" href="https://ibc.tw/css-title-overflow">標題過長使用CSS文本溢出屬性</a> 最早出現於 <a rel="nofollow" href="https://ibc.tw">鈞啟網路科技有限公司</a>。</p>
]]></description>
										<content:encoded><![CDATA[<p><img loading="lazy" decoding="async" class="wp-image-545 alignnone" src="https://www.ibc.tw/wp-content/uploads/2019/01/ibc-p544-1.jpg" alt="" width="526" height="296" srcset="https://ibc.tw/wp-content/uploads/2019/01/ibc-p544-1.jpg 1920w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p544-1-300x169.jpg 300w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p544-1-768x432.jpg 768w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p544-1-1024x576.jpg 1024w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p544-1-600x338.jpg 600w" sizes="(max-width: 526px) 100vw, 526px" /></p>
<p>在網頁設計上，有時為了排版好看，會將過長的標題省略，並以省略號(&#8230;)表示，省略號也表示節省原文或語句未完、意思未盡的意思。</p>
<blockquote><p>div {</p>
<p>white-space: nowrap;   /*不斷行*/<br />
overflow: hidden;   /*超出部分隱藏*/<br />
text-overflow: ellipsis;   /*顯示省略符號*/</p>
<p>}</p></blockquote>
<p>但以上CSS語法僅適用單行。</p>
<p>這篇文章 <a rel="nofollow" href="https://ibc.tw/css-title-overflow">標題過長使用CSS文本溢出屬性</a> 最早出現於 <a rel="nofollow" href="https://ibc.tw">鈞啟網路科技有限公司</a>。</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>取消WooCommerce單一商品圖片放大平滑功能</title>
		<link>https://ibc.tw/disable-woocommerce-image-zoom</link>
		
		<dc:creator><![CDATA[weking]]></dc:creator>
		<pubDate>Sun, 06 Jan 2019 23:45:37 +0000</pubDate>
				<category><![CDATA[網站教學]]></category>
		<category><![CDATA[網誌]]></category>
		<guid isPermaLink="false">https://www.ibc.tw/?p=529</guid>

					<description><![CDATA[<p>如果你是使用Wordpress架站，也有使用WooCommerce來架設購物車，在單一商品頁面上，會有滑鼠移動</p>
<p>這篇文章 <a rel="nofollow" href="https://ibc.tw/disable-woocommerce-image-zoom">取消WooCommerce單一商品圖片放大平滑功能</a> 最早出現於 <a rel="nofollow" href="https://ibc.tw">鈞啟網路科技有限公司</a>。</p>
]]></description>
										<content:encoded><![CDATA[<p>如果你是使用Wordpress架站，也有使用WooCommerce來架設購物車，在單一商品頁面上，會有滑鼠移動至圖片產生放大效果的功能，雖然這效果立意很好，但通常放大圖片也並非很清晰，圖片呈現模糊，反而在使用上感受欠佳，如下圖</p>
<p><img loading="lazy" decoding="async" class="alignnone size-full wp-image-535" src="https://www.ibc.tw/wp-content/uploads/2019/01/ibc-p529-1.jpg" alt="" width="1920" height="1080" srcset="https://ibc.tw/wp-content/uploads/2019/01/ibc-p529-1.jpg 1920w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p529-1-300x169.jpg 300w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p529-1-768x432.jpg 768w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p529-1-1024x576.jpg 1024w, https://ibc.tw/wp-content/uploads/2019/01/ibc-p529-1-600x338.jpg 600w" sizes="(max-width: 1920px) 100vw, 1920px" /></p>
<p>此時只要在CSS中加入以下語法即可讓此效果隱藏</p>
<blockquote><p>/*取消商品圖片放大功能*/<br />
.woocommerce div.product div.images<br />
<span style="font-size: 1.2em;">.woocommerce-product-gallery__wrapper<br />
.zoomImg<br />
{display:none!important;<br />
cursor:default!important; }</span></p></blockquote>
<p>若希望圖片上的放大鏡也隱藏，可加以下語法</p>
<blockquote><p>/*取消商品圖片上放大鏡圖示*/<br />
.woocommerce-product-gallery__trigger</p>
<p>{display:none;}<br />
.woocommerce-product-gallery__trigger</p>
<p>{display:none; }</p></blockquote>
<p>&nbsp;</p>
<p>這篇文章 <a rel="nofollow" href="https://ibc.tw/disable-woocommerce-image-zoom">取消WooCommerce單一商品圖片放大平滑功能</a> 最早出現於 <a rel="nofollow" href="https://ibc.tw">鈞啟網路科技有限公司</a>。</p>
]]></content:encoded>
					
		
		
			</item>
	</channel>
</rss>
