Chủ Nhật, 9 tháng 3, 2014

Gadgets for Blogger - Tiện ich cho Blogger

Gadgets for Blogger Tiện ích cho Blogger

At Google, gadgets are simple HTML and JavaScript applications that can be embedded in web pages and other apps, including Blogger.

Tại Google, tiện ích này là HTML và JavaScript ứng dụng đơn giản có thể được nhúng vào các trang web và các ứng dụng khác, bao gồm Blogger.

When you build a gadget for Blogger, it becomes available to millions of active bloggers. Just submit your gadget to us, and it will surface in Blogger.com where users can easily browse, configure, and add your gadget to their blog's sidebar

.Khi bạn xây dựng một tiện ích cho Blogger, nó trở nên có sẵn cho hàng triệu blogger đang hoạt động. Chỉ cần nộp tiện ích của bạn cho chúng tôi, và nó sẽ bề mặt trong Blogger.com nơi người dùng có thể dễ dàng duyệt, cấu hình, và thêm tiện ích của bạn để tại thanh bên blog của họ .

So now that you know Blogger is a great distribution platform for your gadget, what are you waiting for? Get started building gadgets for Blogger now!

Vì vậy, bây giờ mà bạn biết Blogger là một nền tảng phân phối lớn cho tiện ích của bạn, những gì bạn chờ đợi? Bắt đầu xây dựng các tiện ích cho Blogger bây giờ!

Get Started Bắt đầu

Gadget Developer Guide Hướng dẫn phát triển tiện ích	In their simplest form, gadgets for Blogger are "Google Gadgets". If you aren't familiar with Gadgets yet, take a look at theDeveloper Guide to get started. ở dạng đơn giản của nó, tiện ích cho Blogger là " Google Gadgets ". Nếu bạn không quen với tiện ích nào, hãy xem Hướng dẫn phát triển để bắt đầu.
Accessing Blog Data from the Gadget Truy cập dữ liệu Blog từ tiện ích	Blogger's JSON APIs give gadgets access to a blog's post and comment data, letting them leverage the context of the surrounding content. JSON Blogger tiện ích cung cấp cho các tiện ích truy cập vào bài viết của một blog và dữ liệu bình luận, cho phép họ tận dụng bối cảnh nội dung xung quanh .
Best UI Practices for Bloger Gadgets	Best practices for making your gadget look good across the large set of blog styles and layouts.
Example Gadget	A simple example gadget implementing best practices.
Testing your gadget in Blogger	How to test your gadget in Blogger.
Submit your gadget to Blogger	Now that your gadget is bug-free and beautiful, tell the world about it!

Accessing Blog Data from the Gadget

Blogger provides read-only blog data access to gadgets. The API retrieves public post and comment data for the blog hosting the gadget. Developers can opt to retrieve the data directly in Blogger's JSON format, or retrieve the URL of the underlying Atom feed for future use.

The API is available as the google.blog feature; a gadget that depends on the data can require this feature. If you'd like your gadget to optionally access blog data but still be compliant with other Google Friend Connect containers you can make the feature optional.

Blog Posts

getPostsJson(callback)
Retrieves feed of recent posts for the current blog, returning it as JSON to the callback.

getPostsFeedUrl()
Returns the URL of the Atom feed of all posts for the current blog.

Blog Comments

getCommentsJson(callback)
Retrieves feed of recent comments (across all posts on the blog), returning it as JSON to the callback (format documented here).

getCommentsFeedUrl()
Returns the URL of the Atom feed of all recent comments.

The Current Blog Post

When a gadget is being displayed on an individual post page, these methods access the data for that post. If the gadget is not on an individual post page, these return null. You can use getCurrentCommentsFeedUrl()!=null as a test to indicate the gadget's environment.

getCurrentPostJson(callback)
Retrieves the current post as JSON, or null if there is none.

getCurrentCommentsFeedUrl()
Returns the URL of the Atom feed for recent comments on the current post, or null if there is no current post.

getCurrentCommentsJson(callback)
Returns the feed of recent comments for the current post, returning it as JSON to the callback (format documented here).

Example Snippet Accessing Blog Data Ví dụ một số câu Truy cập dữ liệu Blog

This snippet calculates the word count for the various authors on a blog based on the last few posts, using each author's OpenSocial ID as a key for ease of lookup later.

Đoạn này tính từ tính cho các tác giả khác nhau trên một blog dựa trên những bài viết mới nhất, sử dụng OpenSocial ID của mỗi tác giả như một chìa khóa để dễ tra cứu sau đó.

...

// Calculate wordiness of blog authors:
function onLoadFeed(data) {
  if (data.rc != 200) {
    w(["Error loading blog data"]);
    return;
  }
  var feed = data.data.feed;
  var word_counts = new Array();
  var wordiness = new Array();

  for (var i = 0; i < feed.entry.length; i++) {
    var entry = feed.entry[i];
    var word_count = entry.content.$t.split(/\s/).length;
    var osid = getOpenSocialId(entry.author[0]);
    var author = entry.author[0].name.$t;
    var authorid = getOpenSocialId(entry.author[0]);
    var key = [author,authorid];
    if (wordiness[key]==undefined)
      wordiness[key] = word_count;
    else
      wordiness[key] += word_count;
  }

  var disp = new Array();
  for (var k in wordiness) {
     disp.push(k + " : " + wordiness[k] + " words");
  }
  w(disp);
}

// Return the OpenSocial ID for an author if available
function getOpenSocialId(person) {
  var extendedProperty = person.gd$extendedProperty;

  if (extendedProperty && extendedProperty.name == "OpenSocialUserId") {
    return extendedProperty.value;
  } else {
    return null;
  }
}

// Write output to a display element on the gadget
function w(arr) {
  var str = "";
  for (var e in arr) {
    str += "
"+arr[e]+"
";
  }
  str += "
";
  document.getElementById('display').innerHTML = str;
}

Best UI Practices for Blogger Gadgets

Bloggers want to look good on the web. Follow these best practices so your gadget blends seamlessly with the many themes bloggers use.

Support A Range of Widths

In Blogger, the available width for your gadget depends both on the blog's template, and on the location where the gadget is inserted in the blog. The sidebars in Blogger.com templates range from 150px - 360px wide, though some templates have sidebars that resize to be wider when the browser window is stretched. In addition blog administrators can overwrite the default sidebar width.

In addition, gadgets can be added to the blog's side bar, header, or footer regions as shown by the orange rectangle in the images below.

This means your gadget should be flexible to work well at almost any width. Be sure to test your gadget in a variety of sizes in the blog before submitting your gadget.

Managing Gadget Height

By default, gadgets are 200 pixels high. You can use the attribute height="nn" to specify a static height that is bigger or smaller than the default. However most gadgets will need to dynamically change their height. Follow these guidelines to dynamically resize the height of your gadget.

Inherit the Blog's Style

The skins feature provides access to key Blogger theme parameters. This feature is shared between Blogger and Google Friend Connect and the same skin parameters are used in both. In Blogger, the parameters are automatically inherited from the blog's template, so gadgets can easily blend in with the look and feel of the containing page. Blog owners can also override skin values if they wish to do so.

To access the parameters, a gadget asks for the skins feature:

It can then access parameters via the API, setting styles of elements via DOM manipulation:

<$("someElement").style.borderColor = gadgets.skins.getProperty('BORDER_COLOR');

Core Skin Parameters

These parameters are the most critical to use, and are always provided by the container. Each of these maps to an equivalent CSS style and can be added to HTML elements.

BORDER_COLOR
Color of border of gadget, or 'transparent' if no border desired. Use this for the style of any border around the entire gadget; do not assume that the border is always visible (many blogs do not frame gadgets with borders).

CONTENT_BG_COLOR
Background color to use for main portion of gadget. This usually matches the background color of the blog's sidebar, but in any case is chosen by the container to make gadgets look good.

CONTENT_LINK_COLOR
Color of links in the main portion of gadget; chosen by the container to be readable against CONTENT_BG_COLOR, work well with CONTENT_TEXT_COLOR, and be consistent with links elsewhere on the page.

CONTENT_TEXT_COLOR : Color of primary or most-displayed text in main portion of gadget; chosen by the container to be readable against CONTENT_BG_COLORand consistent with text on the rest of the page.

FONT_FACE
Font face to use by default; chosen to be consistent with the rest of the content.

Extended Skin Variables

These may be used by a page owner to further tweak appearance on a per-gadget basis. They are not needed for all gadgets, but if your gadget uses these concepts, it should allow these variable to control their style.

CONTENT_HEADLINE_COLOR
Text color for titles or headlines as opposed to body text. Defaults to CONTENT_TEXT_COLOR.

CONTENT_SECONDARY_TEXT_COLOR
An alternative color for secondary text that complements CONTENT_TEXT_COLOR. Defaults to CONTENT_TEXT_COLOR.

CONTENT_SECONDARY_LINK_COLOR
Color for links in secondary text. Defaults to CONTENT_LINK_COLOR.

ENDCAP_BG_COLOR
Color for top and bottom cap sections for the gadget; defaults to CONTENT_BG_COLOR.

ENDCAP_LINK_COLOR
Color for links within top / bottom cap sections; defaults to CONTENT_LINK_COLOR.

ENDCAP_TEXT_COLOR
Color for text within top / bottom cap sections; defaults to CONTENT_TEXT_COLOR.

ALTERNATE_BG_COLOR
Used for alternating rows in large list; defaults to CONTENT_BG_COLOR

CONTENT_VISITED_LINK_COLOR
Visited link color; defaults to CONTENT_LINK_COLOR.

Using Canvas Mode

To create a canvas("big mode") view of your gadget, where the gadget expands horizontally to span the entire gadget area, you must define a section for the "canvas" view type, as follows:

Keep it simple

Each element, style, or graphic you add to your gadget, is something else that might clash with the containing blog's style. You want your gadget to blend seamlessly into as many blogs as possible. Avoid adding elements that cannot be skinned using the above defined skin parameters.

Do not add a title into your gadget's UI. Blogger will add the title automatically outside of the gadget in the same style as other gadget titles on the blog.

Most importantly, test your gadget on a number of different blogs. Modify the blog's background color, text color, and font face to ensure your gadget blends with a wide range of templates.

Example Gadget

Here is a very simple Friend Connect powered gadget that takes advantage Blogger's JSON API. The gadget displays the current post's comments and highlights the comment if it was made by the viewer's friend. When the gadget is embedded in a blog, it will match the blog's style because it inherits several skin parameters.

The example gadget is also hosted here: example gadget.



  
  
  
  
 
 
   <![CDATA[
   
   
Canvas mode
   




]]>

Testing your Gadget in Blogger

Since a gadget for Blogger is a Google Gadget, follow this guide for testing and preparing your Google Gadget for publication. One complete, read and follow the sections below describing how to test your gadget in Blogger.

Setting up a Test Blog

Create a test blog with some post and comment data to use during testing:

Download test_blog_data.xml.zip; uncompress the file and save test_blog_data.xml to your computer.
Go to the Import Blog Page
Upload test_blog_data.xml and follow the instructions to import the blog content and publish it.

Now you're ready to start testing.

Debugging your gadget in Blogger

The functionality and appearance of your gadget depends on the blog that contains it. Therefore, the best way to debug your gadget is to test it in the context of an actual blog on Blogger.com. Above we described how to create a test blog, below we discuss how to add your gadget to your test blog and debug it on the blog.

First, make sure that your gadget XML file is hosted on a public web server, and that you have a test blog set up. From Blogger.com, go to Layout -> Add a Gadget ->Add your Own, enter your gadget's URL, and then save. The gadget will be added to your blog; click View Blog to view and test your gadget in the blog.

Testing Gadget Configuration in Blogger

Blogger provides a standard UI for adding and configuring gadgets. You should test that any UserPrefs you've defined can correctly be configured by the blog administrator in Blogger.com.

From Blogger.com, click the Layout tab, then click Add a Gadget. From the Gadget Diretory, choose Add your own. This allows you to add your gadget by its URL (note: the gadget must be hosted on a public web server).

When you add a gadget, it will display a preview and show any UserPref parameters that can be configured. Test updating various configuration values and adding your gadget to your test blog. Confirm your gadget works as expected on the blog itself.

Testing Width and Height

In Blogger, the available width for your gadget depends on the location it is inserted. Gadgets can be added to the blog's side bar, header, or footer regions as shown by the orange rectangle in the images below.

From Blogger.com, click the Layouts tab for your test blog. Drag your test gadget into the following regions, and click Save to view and test your gadget in those locations.

side bar
header area
footer area

Also test the gadget in the sidebar of several different templates, since sidebar widths vary from template to template. From Blogger.com, click the Layout tab for your blog. Then click Pick a new Template. From the Template Picker, test that your gadget works well in the side bar of these templates:

Scribe (150px sidebar)
Rounders (215px sidebar)
Tekka (360px sidebar)
Denim Stretch (variable widgth sidebar)

Testing Style, Fonts and Colors

As described above, your gadget should use skinning parameters to inherit the blog's style including text colors, background colors, and font face. Test that your gadget correctly inherits the blog's style by testing it on a variety of different blog templates.

From Blogger.com, click the Layout tab. Then click Pick a new Template. From the Template Picker, confirm your gadget correctly inherits styles from the following templates:

Minima Dark
Denim
No. 897
Rounders
The more the better!

You may want to also edit the blog's Fonts and Colors directly. From the Layouts tab, click Fonts and Colors to control specific font and color choices for the blog and verify they are correctly inherited by your gadget.

Submit your gadget

Once you've throughougly tested your gadget, and followed Blogger's Best UI Practices, you're ready to submit your gadget.

Submit your gadget to Blogger now!

======================================================

Tiện ích cho Blogger

Tại Google, tiện ích này là HTML và JavaScript ứng dụng đơn giản có thể được nhúng vào các trang web và các ứng dụng khác, bao gồm Blogger.

Khi bạn xây dựng một tiện ích cho Blogger, nó trở nên có sẵn cho hàng triệu blogger đang hoạt động. Chỉ cần nộp tiện ích của bạn cho chúng tôi, và nó sẽ bề mặt trong Blogger.com nơi người dùng có thể dễ dàng duyệt, cấu hình, và thêm tiện ích của bạn để tại thanh bên blog của họ .

Bắt đầu

Hướng dẫn phát triển tiện ích ở dạng đơn giản của nó, tiện ích cho Blogger là " Google Gadgets ". Nếu bạn không quen với tiện ích nào, hãy xem Hướng dẫn phát triển để bắt đầu.

Truy cập dữ liệu từ API JSON Blog Blogger của tiện ích cung cấp cho các tiện ích truy cập vào bài viết của một blog và dữ liệu bình luận, cho phép họ tận dụng bối cảnh nội dung xung quanh .

Thực hành giao diện người dùng tốt nhất cho Bloger Tiện ích thực hành tốt nhất để làm cho tiện ích của bạn nhìn tốt trên tập hợp lớn của phong cách blog và bố cục.

Ví dụ Gadget Một tiện ích ví dụ đơn giản thực hiện tốt nhất.

Thử nghiệm tiện ích của bạn trong Blogger Làm thế nào để kiểm tra tiện ích của bạn trong Blogger .

Trình tiện ích của bạn để Blogger Bây giờ tiện ích của bạn lỗi-miễn phí và xinh đẹp, nói với thế giới về nó!

Truy cập vào Blog Số liệu từ tiện ích

Blogger cung cấp truy cập chỉ đọc blog của dữ liệu tiện ích. API lấy bưu chính công cộng và dữ liệu bình luận cho blog lưu trữ tiện ích này. Các nhà phát triển có thể lựa chọn để lấy dữ liệu trực tiếp trong định dạng JSON Blogger, hoặc lấy URL của nguồn cấp dữ liệu Atom cơ bản để sử dụng trong tương lai.

API có sẵn như là các tính năng google.blog ; một tiện ích mà phụ thuộc vào các dữ liệu có thể yêu cầu tính năng này. Nếu bạn muốn tiện ích của bạn để tùy chọn truy cập dữ liệu blog nhưng vẫn được tuân thủ container với Google Friend Connect khác bạn có thể làm cho các tính năng tùy chọn .

Blog

getPostsJson ( gọi lại)

Lấy thức ăn của bài viết gần đây cho blog hiện nay, trở về nó như là JSON để gọi lại .

getPostsFeedUrl ( )

Trả về URL của nguồn cấp dữ liệu Atom của tất cả các bài viết cho blog hiện tại .

Blog Bình luận

getCommentsJson ( gọi lại)

Lấy thức ăn của kiến gần đây ( trên tất cả các bài viết trên blog ) , trả lại nó như JSON để gọi lại ( định dạng tài liệu ở đây ) .

getCommentsFeedUrl ( )

Trả về URL của nguồn cấp dữ liệu Atom của tất cả các ý kiến gần đây .

Current bài viết Blog

Khi một tiện ích đang được hiển thị trên một trang bài viết cá nhân , các phương pháp truy cập dữ liệu cho bài viết đó . Nếu tiện ích không phải là trên một trang bài viết cá nhân , những trả về null. Bạn có thể sử dụng getCurrentCommentsFeedUrl ( ) ! = Null như là một thử nghiệm để chỉ môi trường của tiện ích.

getCurrentPostJson ( gọi lại)

Lấy bài hiện tại như JSON , hoặc null nếu không có .

getCurrentCommentsFeedUrl ( )

Trả về URL của Atom feed cho ý kiến gần đây trên các bài viết hiện tại , hoặc null nếu không có bài hiện tại .

getCurrentCommentsJson ( gọi lại)

Trả về thức ăn của kiến gần đây cho bài viết hiện tại, trả lại nó như JSON để gọi lại ( định dạng tài liệu ở đây ) .

Ví dụ một số câu liên Truy cập dữ liệu Blog

Đoạn này tính từ tính cho các tác giả khác nhau trên một blog dựa trên những bài viết mới nhất , sử dụng OpenSocial ID của mỗi tác giả như một chìa khóa để dễ tra cứu sau đó.

...

/ / Tính toán dài dòng của blog tác giả :

chức năng onLoadFeed (dữ liệu) {

if ( data.rc ! = 200) {

w ( [" Lỗi tải blog của dữ liệu " ] ) ;

trở lại;

}

nguồn cấp dữ liệu var = data.data.feed ;

var word_counts = new Array ();

var dài dòng = new Array ();

for (var i = 0; i < feed.entry.length ; i + +) {

var entry = feed.entry [i];

. var word_count = entry.content $ t.split ( / \ s / ) chiều dài .

var osid = getOpenSocialId ( entry.author [0]) ;

var author = entry.author [0] $ t tên . .

var authorid = getOpenSocialId ( entry.author [0]) ;

var key = [tác giả , authorid ] ;

if ( dài dòng [key] == undefined )

dài dòng [key] = word_count ;

khác

dài dòng [key] + = word_count ;

}

var disp = new Array ();

for (var k trong dài dòng ) {

disp.push (k + " :" + dài dòng [k] + " từ ");

}

w ( Disp ) ;

}

/ / Trả lại ID OpenSocial cho một tác giả nếu có

chức năng getOpenSocialId (người) {

var extendedProperty = person.gd $ extendedProperty ;

if ( extendedProperty && extendedProperty.name == " OpenSocialUserId " ) {

trở extendedProperty.value ;

} Else {

trở về null ;

}

/ / Viết ra vào một phần tử hiển thị trên các tiện ích

chức năng w ( arr) {

var str = "

" ;

for (var e trong arr) {

str + = "

" + arr [e] + " </ p> " ;

}

str + = " </ ul> " ;

. document.getElementById (' Màn hình') innerHTML = str;

}

Thực hành giao diện người dùng tốt nhất cho Blogger Tiện ích

Các blogger muốn nhìn tốt trên web. Thực hiện theo các thông lệ tốt nhất để tiện ích của bạn pha trộn hoàn hảo với nhiều chủ đề các blogger sử dụng .

Hỗ trợ Phạm vi các độ rộng

Trong Blogger, chiều rộng có sẵn cho tiện ích của bạn phụ thuộc cả vào mẫu của blog , và vào vị trí nơi mà các tiện ích này được lắp vào blog. Sidebars trong mẫu Blogger.com từ 150px - 360px rộng , mặc dù một số mẫu có sidebars mà thay đổi kích thước được rộng hơn khi các cửa sổ trình duyệt được kéo dài . Ngoài ra quản trị viên blog có thể ghi đè lên chiều rộng bên mặc định.

Ngoài ra, các tiện ích có thể được thêm vào thanh bên của blog , tiêu đề, hoặc khu vực chân như thể hiện bởi các hình chữ nhật màu da cam trong những hình ảnh dưới đây .

Điều này có nghĩa tiện ích của bạn cần linh hoạt để làm việc tốt ở hầu như bất kỳ chiều rộng . Hãy chắc chắn để kiểm tra tiện ích của bạn trong một loạt các kích cỡ trong blog trước khi trình tiện ích của bạn .

Quản lý tiện ích Chiều cao

Theo mặc định, tiện ích này là cao 200 pixel. Bạn có thể sử dụng chiều cao thuộc tính = " nn " để chỉ định chiều cao tĩnh mà là lớn hơn hoặc nhỏ hơn so với mặc định. Tuy nhiên hầu hết các tiện ích sẽ cần phải tự động thay đổi chiều cao của họ . Thực hiện theo các hướng dẫn để tự động thay đổi kích thước chiều cao của tiện ích của bạn .

Kế thừa phong cách của Blog

Các tính năng giao diện cung cấp quyền truy cập vào các thông số chủ đề quan trọng Blogger . Tính năng này được chia sẻ giữa Blogger và Google Friend Connect và thông số tương tự da được sử dụng trong cả hai. Trong Blogger, các thông số sẽ tự động được thừa hưởng từ mẫu của blog , vì vậy các tiện ích có thể dễ dàng pha trộn vào với cái nhìn và cảm nhận của trang chứa . Chủ sở hữu blog cũng có thể ghi đè lên giá trị da nếu họ muốn làm như vậy .

Để truy cập vào các thông số , một tiện ích yêu cầu các tính năng giao diện :

Sau đó nó có thể truy cập các thông số thông qua các API , thiết lập phong cách của các yếu tố thông qua thao tác DOM :

. < $ (" someElement " ) style.borderColor = gadgets.skins.getProperty (' BORDER_COLOR ');

Lõi da thông số

Các thông số này là quan trọng nhất để sử dụng, và luôn luôn được cung cấp bởi các container. Mỗi bản đồ đến một phong cách CSS tương đương và có thể được thêm vào các phần tử HTML .

BORDER_COLOR

Màu của đường viền của tiện ích , hoặc "minh bạch" nếu không có biên giới mong muốn. Sử dụng này cho phong cách của bất kỳ biên giới xung quanh toàn bộ tiện ích , đừng cho rằng biên giới luôn có thể nhìn thấy ( nhiều blog không khung tiện ích với biên giới ) .

CONTENT_BG_COLOR

Màu nền để sử dụng cho phần chính của tiện ích này. Điều này thường phù hợp với màu nền của sidebar của blog , nhưng trong mọi trường hợp được lựa chọn bởi các container để làm cho tiện ích nhìn tốt.

CONTENT_LINK_COLOR

Màu sắc của các liên kết trong phần chính của tiện ích ; được lựa chọn bởi các container để có thể đọc được với CONTENT_BG_COLOR , làm việc tốt với CONTENT_TEXT_COLOR , và phù hợp với các liên kết khác trên trang.

CONTENT_TEXT_COLOR : Màu của văn bản chính hoặc nhất hiển thị trong phần chính của tiện ích ; được lựa chọn bởi các container để có thể đọc được với CONTENT_BG_COLOR và phù hợp với văn bản trên phần còn lại của trang.

FONT_FACE

Mặt chữ để sử dụng theo mặc định, chọn để phù hợp với phần còn lại của nội dung.

Biến da mở rộng

Đây có thể được sử dụng bởi một chủ sở hữu trang để tiếp tục tinh chỉnh xuất hiện trên một cơ sở cho mỗi tiện ích. Họ không cần thiết cho tất cả các tiện ích, nhưng nếu tiện ích của bạn sử dụng các khái niệm, nó sẽ cho phép các biến để kiểm soát phong cách của họ .

CONTENT_HEADLINE_COLOR

Màu chữ cho tiêu đề hoặc tiêu đề như trái ngược với nội dung chính. Mặc định là CONTENT_TEXT_COLOR .

CONTENT_SECONDARY_TEXT_COLOR

Một màu thay thế cho văn bản thứ cấp bổ sung CONTENT_TEXT_COLOR . Mặc định là CONTENT_TEXT_COLOR .

CONTENT_SECONDARY_LINK_COLOR

Màu sắc cho các liên kết trong văn bản thứ cấp. Mặc định là CONTENT_LINK_COLOR .

ENDCAP_BG_COLOR

Màu cho phần nắp trên và dưới cho các tiện ích ; mặc định CONTENT_BG_COLOR .

ENDCAP_LINK_COLOR

Màu sắc cho các liên kết trong phần nắp trên / dưới ; mặc định CONTENT_LINK_COLOR .

ENDCAP_TEXT_COLOR

Màu sắc cho văn bản trong phần nắp trên / dưới ; mặc định CONTENT_TEXT_COLOR .

ALTERNATE_BG_COLOR

Được sử dụng để luân phiên hàng trong danh sách lớn ; mặc định CONTENT_BG_COLOR

CONTENT_VISITED_LINK_COLOR

Thăm màu liên kết, mặc định là CONTENT_LINK_COLOR .

Sử dụng chế độ Canvas

Để tạo ra một bức tranh ( "chế độ lớn" ) quan điểm của tiện ích của bạn , nơi mà các tiện ích mở rộng theo chiều ngang để mở rộng toàn bộ khu vực tiện ích , bạn phải xác định một phần cho " vải " xem loại, như sau:

Giữ nó đơn giản

Mỗi yếu tố , phong cách, hoặc đồ họa bạn thêm vào tiện ích của bạn , là cái gì khác mà có thể xung đột với phong cách blog chứa của . Bạn muốn tiện ích của bạn để pha trộn hoàn toàn với nhiều blog càng tốt. Tránh thêm các yếu tố mà không thể được da bằng cách sử dụng các thông số định nghĩa ở trên da .

Không thêm một danh hiệu vào giao diện người dùng của tiện ích của bạn . Blogger sẽ thêm danh hiệu tự động bên ngoài của các tiện ích theo phong cách tương tự như tiêu đề tiện ích khác trên blog.

Quan trọng nhất, thử nghiệm tiện ích của bạn trên một số blog khác nhau. Sửa đổi màu sắc của blog nền, màu chữ, kiểu chữ để đảm bảo tiện ích của bạn pha trộn với một loạt các mẫu .

ví dụ tiện ích

Đây là một tiện ích rất đơn giản Bạn bè Kết nối hỗ trợ diễn JSON API lợi thế của Blogger. Các tiện ích sẽ hiển thị bình luận bài viết hiện tại và nêu bật những nhận xét nếu nó được thực hiện bởi người bạn của người xem. Khi tiện ích được nhúng vào trong một blog, nó sẽ phù hợp với phong cách của blog bởi vì nó được thừa hưởng một số thông số da .

Các tiện ích ví dụ cũng được tổ chức tại : ví dụ tiện ích.

</ ModulePrefs >

<! [CDATA [

Yêu Hà Nội

Chủ Nhật, 9 tháng 3, 2014

Gadgets for Blogger - Tiện ich cho Blogger

Gadgets for Blogger Tiện ích cho Blogger

Get Started Bắt đầu

Accessing Blog Data from the Gadget

Blog Posts

Blog Comments

The Current Blog Post

Example Snippet Accessing Blog Data Ví dụ một số câu Truy cập dữ liệu Blog

Best UI Practices for Blogger Gadgets

Support A Range of Widths

Managing Gadget Height

Inherit the Blog's Style

Core Skin Parameters

Extended Skin Variables

Using Canvas Mode

Keep it simple

Example Gadget

Testing your Gadget in Blogger

Setting up a Test Blog

Debugging your gadget in Blogger

Testing Gadget Configuration in Blogger

Testing Width and Height

Testing Style, Fonts and Colors

Submit your gadget

Không có nhận xét nào:

Đăng nhận xét

Nhãn

Translate

Bài đăng phổ biến

Giới thiệu về tôi

Tổng số lượt xem trang

Bài đăng phổ biến

Trang

Trang

Bài đăng phổ biến