أرشيف التصنيف: HTML

HTML

الحصول على الإصدار الجديد من جوجل جداول البيانات كما JSONP

< تحذير >
أنصحك للحصول على حساب جوجل اضافية فقط للجمهور.
لأنه إذا كنت تتبع الإجراء بلدي، وسوف يكون عنوان Gmail على ملف JSONP العامة.

< جوجل جداول البيانات >
الإصدار القديم من جوجل جداول البيانات يمكن مشاركة جداول البيانات ك XML، JSON وبعض نوع من التنسيق. اعتقد لا يملك نسخة جديدة مثل وظائف المشاركة. ولكن وجدت حلا جيدا للنسخة الجديدة من جوجل جداول البيانات على الاجابة عن سؤال حول ستاكوفيرفلوو.
Unable to publish specific cells in new Google Spreadsheets – StackOverflow ( في اللغة الإنجليزية )
وفقا لصفحة أعلاه، وهذا API هو نوع من API القديمة. ليس هناك من هو متأكد متى تتوقف. لا يهمني هذا الوضع. ولكن إذا كنت لا تحب هذا الوضع، وأنا لا أنصح لك لاستخدام هذا API.

< تنسيق URL >

https://spreadsheets.google.com/feeds/cells/[ الرئيسية من جدول البيانات ]/od6/public/values?min-row=[ بدء رقم الصف ]&max-row=[ نهاية رقم الصف ]&min-col=[ بدء رقم العمود ]&max-col=[ رقم العمود نهاية ]&alt=json-in-script&callback=[ رد اسم الدالة ]

< كيفية استخدامه؟ >
تنسيق JSONP هي سهلة الاستخدام في جافا سكريبت. لا أحد بحاجة المحلل. ولكن أريد أن استخدام مولد URL لجعل API أكثر فائدة. لذلك أنا وضعت السيناريو الذي يحول من المعلمات الترحيل إلى معلمات URL التالية بناء جملة جوجل.

< مسج المساعد >
أنا وضعت هذا البرنامج المساعد مسج اسمه “generateGoogleJsonpUri”.
generateGoogleJsonpUri – github
أنا خلقت الصفحة عينة مثل إطار بلوق لاختبار بلدي المساعد.
https://mecrazy.net/sample/generateGoogleJsonpUri/
إذا كنت تريد، يرجى نسخ مصدره كمثال على ذلك.

< استعمال – صب >
صب الجملة هو

var test = $.genJsonpGDU("<وضع الخاص بك بين جدول المفتاح هنا>");

أو

var test = $.genJsonpGDU({key:"<وضع الخاص بك بين جدول المفتاح هنا>"});

.

يمكنك العثور على مفتاح في URL من جدول البيانات. فمن عينتي أدناه.
spreadsheet_sample_001
على هذه الصورة، URL هو “https://docs.google.com/spreadsheets/d/1IG2QEOXehU01b6DoMQi19CvFpm2EZJOUM2y4lqXKduw/edit#gid=0”. المفتاح لجدول البيانات الخاص بي هو “1IG2QEOXehU01b6DoMQi19CvFpm2EZJOUM2y4lqXKduw”. يرجى التحقق من عنوان URL من جدول البيانات الخاص بك للحصول على المفتاح الخاص بك.

< استعمال – تكوين البيجر >

test.pager({
  startRow:2,//رقم الصف لبدء الحصول على (مطلوب)
  minCol:2,//رقم العمود لبدء الحصول على (مطلوب)
  maxCol:7,//رقم العمود لانهاء الحصول على (مطلوب)
  recsPerPage:5//السجلات في الصفحة (اختياري)
});

يرجى مقارنة الجملة أعلاه والجدول أدناه. عندما كنت انظر الجدول أدناه، يرجى تخيل إكسل أو أي نوع من البيانات. الجملة أعلاه تعني مجموعة من الصفحة الأولى هي مجموعة الوردي، الصفحة 2 هو مجموعة الأخضر. “B2:G2” هو السجل الأول. “B6:G6” هو سجل الخامس.

A1 B1 C1 D1 E1 F1 G1 H1
A2 B2 C2 D2 E2 F2 G2 H2
A3 B3 C3 D3 E3 F3 G3 H3
A4 B4 C4 D4 E4 F4 G4 H4
A5 B5 C5 D5 E5 F5 G5 H5
A6 B6 C6 D6 E6 F6 G6 H6
A7 B7 C7 D7 E7 F7 G7 H7
A8 B8 C8 D8 E8 F8 G8 H8
A9 B9 C9 D9 E9 F9 G9 H9
A10 B10 C10 D10 E10 F10 G10 H10
A11 B11 C11 D11 E11 F11 G11 H11
A12 B12 C12 D12 E12 F12 G12 H12
A13 B13 C13 D13 E13 F13 G13 H13

< استعمال – الحصول على URL الصفحة >
إنه مثال للحصول على URL الصفحة الأولى.

var pageUrl = test.page(1);

( “test.pager(موضوع)” مطلوب قبل تنفيذ هذه المهمة. )

< استعمال – تنفيذ Ajax >
الحجج ل “test.ajax” هي نفس “http://api.jquery.com/jQuery.ajax/“.

test.ajax({
  url:test.page(1),
  success:function(json){
    console.log(json);
  }
});

إذا كنت تريد أن تعرف الصفحة الحالية لديها الصفحة السابقة أو الصفحة التالية، يرجى استخدام “test.get()” في وظيفة success والمعلمات الاختيار.

test.ajax({
  url:test.page(1),
  success:function(json){
    console.log(json);
    var param = test.get();
    if(param.pager.prev){
      console.log('الصفحة الحالية لديها الصفحة السابقة.');
    }else{
      console.log('الصفحة الحالية ليس لديها الصفحة السابقة.');
    }
    if(param.pager.next){
      console.log('الصفحة الحالية لديها الصفحة التالية.');
    }else{
      console.log('الصفحة الحالية ليس لديها الصفحة التالية.');
    }
  }
});

< استعمال – تحويل JSON إلى مجموعة 2D >
“test.jsonToArr” يحول من صيغة غوغل جسون ل2D صفيف.

test.ajax({
  url:test.page(1),
  success:function(json){
    var arr2d = test.jsonToArr(json);
    console.log(arr2d);
  }
});

< استعمال – ذاكرة التخزين المؤقت متغير >
إذا كنت ترغب في تمكين ذاكرة التخزين المؤقت الترحيل باستخدام متغيرات جافا سكريبت، يرجى اتباع بناء الجملة أدناه.

test.set({cache:true});

تتحول هذه الحجة لاستخدام ذاكرة التخزين المؤقت للترحيل. فإنه يتحقق تاريخ التحديث على JSONP كل 20 دقيقة بشكل افتراضي. إذا غيرت التاريخ، مخبأ واضحة تلقائيا. إذا كنت ترغب في تغيير الفاصل الزمني للتحقق من التاريخ. يمكنك استخدام بناء الجملة مثل أدناه بدلا من الجملة أعلاه.

test.set({
  cache:true,
  cacheInterval:{
    sec:0,min:50,hour:0
  }
});

< خاتمة >
هناك اختلافات أساسية بين جداول جوجل الجديدة والقديمة.

  جديد قديم
خلايا الأقصى 2000000 الخلايا 400000 الخلايا
أعمدة الأقصى غير محدود 256 الأعمدة لكل ورقة

أعتقد أن الإصدار الجديد هو قاعدة بيانات كبيرة بشكل لا يصدق وحرة. أريد أن أجد الأعراف مثيرة للاهتمام من جداول جوجل الجديد.

مولد HTML الأساسية لBootstrap 3

< ما هذا؟ >
فإنه يولد مصدر HTML الأساسية لBootstrap 3. يمكنك اختيار الخيارات عند إنشاء ذلك. أنا غالبا ما تستخدم هذه لنفسي. إذا كنت تريد، من فضلك احفظ هذه الصفحة.


< مولد كهربائي >
صفحة العنوان :
رمز اللغة :
نسخة Bootstrap :
متوافق مع IE القديمة :
استخدام شريط التنقل ثابت :
استخدام تذييل لزجة :
استخدام jQuery الفشل :
استخدام jQuery UI الفشل :
استخدام backbone.js :
استخدام underscore.js :
استخدام bootbox :

إذا اخترت “متوافق مع IE القديمة” “نعم”، تحتاج إلى وضع “bootstrap.min.css” و “respond.min.js” على الخادم الخاص بك. في الأساس “respond.min.js” لا يعمل بشكل صحيح على كندي والخوادم الآخرين.

< مخطوطات >
يمكنك تحميل البرامج النصية التي تستخدم HTML. يمكنك وضع على الخادم الخاص بك واستبدال مسارات البرامج النصية.
Bootstrap
jQuery
jQuery UI
backbone.js
underscore.js
bootbox
html5shiv
Respond.js
( Bootstrap و Respond.js ضرورية لتحميل لIE القديمة. يرجى توخي الحذر. )

جعل STINGER3 (وورد موضوع) متوافق مع WPML (متعدد اللغات المساعد)

< ما هو WPML؟ >
هو البرنامج المساعد لورد بعدة لغات. يمكنني استخدام WPML على هذا mecrazy بلوق.
الموقع الرسمي للWPML

< ما هو STINGER3؟ >
هذا هو موضوع لورد. لديها العديد من الوظائف جميلة من دون المساعد. على سبيل المثال، مقتطف الواضع للإعلانات (مثل جوجل ادسنس) وتصميم رائع أزرار الاجتماعية. لقد أراد أن محاولة استخدام هذا الموضوع.
الموقع الرسمي للSTINGER3 (الصفحة اليابانية)

< نأمل النشاط طيف >
مطور STINGER3 مشغول جدا للرد على تويتر، وأنا لست متأكدا من أنه يمكن قراءة بلغات أخرى غير اليابانية. إذا كان لديك أي أسئلة حول STINGER3، وآمل منك أن تجد الجواب على Google أو حل المشاكل بنفسك.

< بالنسبة للأشخاص الذين لا يستطيعون القراءة اليابانية >
الموقع الرسمي للSTINGER3 هو باللغة اليابانية. أعتقد أنه من الصعب العثور على وصلة التحميل من موضوع ملف مضغوط. يجب أن تجد الكلمة اليابانية “ダウンロード“. وهو ما يعني “تحميل” باللغة العربية. الرجاء استخدام CTRL + F للعثور على هذه الكلمة. يرجى العثور على اسم ملف النسخة “stinger3ver20140327.zip” الحالية.

< رمز التوافق >
رمز أدناه تعطي التوافق WPML لSTINGER3.

<style type="text/css">

.submenu-languages{
  background-color:#f3f3f3;
  border-style:solid;
  border-color:#dedede;
  border-width:0px 1px 1px 1px;
  position:absolute;
  margin-left:-11px;
  margin-top:21px;
  padding-bottom:5px;
  display:none;
}
.submenu-languages > li{
  white-space:nowrap !important;
  float:none !important;
  display:inline-block !important;
}

.iclflag{ vertical-align:middle;position:relative !important;top:-1px !important; }
#lang_sel{ z-index:1000; }
#lang_sel a{ display:block; }
#lang_sel ul,#lang_sel li,#lang_sel a{
  margin:0px;padding:0px;
  width:300px;
  text-align:left;
  white-space:nowrap;
}
#lang_sel ul,#lang_sel li{ margin:0px !important;padding:0px !important; }
#lang_sel a{ margin:0px !important;padding:0px 7px !important; }
#lang_sel li,#lang_sel a,#lang_sel span{
  height:30px !important;
  line-height:30px !important;
  font-size:14px;
}
#lang_sel > ul > li > ul{ top:31px; }

</style>
<script type="text/javascript">
jQuery(function($){
var langMenuObj = $('.submenu-languages').eq(0);
var wpmlMobile = (typeof(window.orientation) != "undefined");
$('.menu-item-language-current').eq(0).on('mouseenter',function(){
if(!wpmlMobile){langMenuObj.stop(true,true).fadeIn('fast');}
}).on('mouseleave',function(){
if(!wpmlMobile){langMenuObj.stop(true,true).fadeOut('slow');}
}).on('click',function(){
langMenuObj.stop(true,true).toggle();
});
$('.icl_lang_sel_current ').parent().click(function(){ return false; });
});
</script>

< كيفية إدراج هذا الرمز؟ >
هناك 3 طرق لادخال المثال التعليمات البرمجية. يرجى اختيار واحد منهم. أو إذا كنت تعرف كيفية تخصيص وورد، يمكنك إدراج يدويا لمخطوطات PHP الخاص بك.

< الطريقة – 1 >
الذهاب إلى [ المظهر – المربعات الجانبية ] من القائمة المسؤول. الرجاء إضافة “نص” إلى منطقة صالحة واحدة. من فضلك لا أدخل العنوان، وضعت النصي فقط في شكل بالتفصيل.

< طريقة – 2 >
أنا وضعت STINGER3 loves WPML المساعد. هذا البرنامج المساعد تفعل الشيء نفسه بأنه “الطريقة – 1”. إذا وجدت البق، يرجى الإبلاغ أو قل لي على Github، Twitter أو Google+.

< طريقة – 3 >
باستخدام وورد البرنامج المساعد “Wp Insert“. فإنه يمكن إدراج رمز HTML إلى أي مكان على بلوق.

< بعد ذلك >
أعتقد كل الأساليب ليست صعبة للغاية. ولكن الإصدار الحالي من STINGER3 غير متوافق مع ملفات mo اللغة. نحن يمكن أن تترجم فقط مع سلسلة ترجمة WPML. إذا كان لدي وقت الفراغ، أريد أن تطوير التصحيح لSTINGER3 متوافق مع ملفات mo.

< تحديث في 11 يونيو 2014 >
ثابت – لا يمكن التعامل مع الحدث الصنبور الأول من الروبوت أو دائرة الرقابة الداخلية المتصفحات. يتم تحديث التعليمات البرمجية المصدر على هذه الصفحة والبرنامج المساعد وورد على جيثب.

توليد صفحات الويب الديناميكية فقط مع محرك جوجل

< تحذير >
أنصحك للحصول على حساب جوجل اضافية فقط للجمهور.
لأنه إذا كنت تتبع الإجراء بلدي، وسوف يكون عنوان Gmail على ملف XML العامة.

< الحل الجديد على 2014/07/10 >
كتبت آخر الحصول على الإصدار الجديد من جوجل جداول البيانات كما JSONP. إذا كنت تريد استخدام النسخة الجديدة من جوجل جداول البيانات لإنشاء صفحات الويب الديناميكية بدلا من النسخة القديمة، يرجى قراءة هذا المنصب.

< تحديث في 2014/04/26 >
الرجاء استخدام Anyfile Notepad أو أي تطبيقات محرر نصوص أخرى لمحرك جوجل على جوجل مخزن ويب بدلا من Drive Notepad. لأنه تم إزالة Drive Notepad من المخزن.

< تحديث في 2014/05/12 >
مهلا! Drive Notepad هو العودة إلى المتجر الويب من Google!

< توصية >
أنصحك لتثبيت “Drive Notepad”. انها امتداد لجوجل محرك. عند تثبيت Drive Notepad، تحتاج Chrome. ولكن بعد الاتصال Drive Notepad إلى Google Drive، لا يشترط Chrome. يمكنك استخدام Drive Notepad على أي المتصفحات.
https://chrome.google.com/webstore/detail/drive-notepad/gpgjomejfimnbmobcocilppikhncegaj?hl=en-GB
drive_notepad_en_us

< لتحديث محتويات من جدول >
تحتاج إلى استخدام “جدول جوجل الإصدار 1”. لأن “النسخة 2” لا يدعم CSV وتقاسم XML حتى الآن. (كتبت هذا المنصب في 19 أبريل 2014.) إذا كنت عادة توليد جدول جديد اليوم، وانها تكون النسخة 2 تلقائيا.

وأوضح جدول جديد جوجل على “Check out the new Google Sheets” (الإنجليزية).

شعرت بالقلق من CSV وسوف تقاسم XML لا يدعم في الإصدار 2، لذلك راجعت أيضا “Unsupported features in the new Google Sheets” (الإنجليزية). ولكن هذه الوظيفة ليست مدرجة في تلك الصفحة. نعم … غير المدرجة … ولكن لا أحد من المؤكد عندما Google تغيير رأيهم ….
يمكنك توافق هذا الوضع؟

دعونا الوصول https://g.co/oldsheets لإنشاء جداول البيانات في الإصدار 1.

انها عينة بلدي.

انها ورقة واحدة فقط. وقد رأس ذلك، 3 من الأعمدة والصفوف 2.
(أنا ذاهب لتوليد imgur موقع على شبكة الإنترنت صورة.)

< دعونا تجعل من الجمهور >
اتبع الموافقة المسبقة عن علم أدناه.
publish_to_the_web_ar

حدد “النشر على الويب…” ودفع “بدء النشر”.
قسم “الحصول على رابط إلى البيانات المنشورة” نرى.
publish_to_the_web_2_ar
يمكنك الحصول على جدول البيانات الخاص بك كصفحة ويب، HTML، CSV، TXT، PDF، ATOM، RSS، XLS والمواد المستنفدة للأوزون. إذا كنت ترغب في مزامنة البيانات إلى موقع الويب الخاص بك، يجب عليك أن تختار CSV، أو ATOM RSS. هذه هي صيغة سهلة للمزامنة. عند اختيار واحد منهم، يمكنك العثور على وظيفة لتحديد الصفوف والأعمدة. هذه الوظيفة يمكن أن تجعل حجم ملف لكل طلب أصغر.

إذا اخترت CSV، قبل اختيار مجموعة، يرجى تحديد ورقة الهدف. عينة مثل الموافقة المسبقة عن علم أدناه.
select_sheet_ar
في عينتي، “A1” هو الرأس. أريد الحصول على 5 صفوف الأقصى. لذلك أنا وضعت مجموعة “A2:A6”.
select_cell_ar
يمكنك العثور على “range=A2%3AA6” في عنوان الموقع. إذا كنت ترغب في إضافة وظيفة ترحيل الصفحات إلى موقع الويب الخاص بك، يجب تغيير حيوي المعلمة ل “range” حسب جافا سكريبت.

< هل من الصعب؟ >
لا تقلق. كتبت رمز Javascript هنا.
https://github.com/mecrazy/generateGoogleDriveUri
هذا السيناريو هو متوافق مع CSV، وATOM RSS الأشكال. انها فقط URI المولد. أنه لا يملك المحلل. إذا اخترت ATOM أو RSS، يمكنك استخدام jQuery بمثابة المحلل.

يرجى استخدام “generateGoogleDriveUri.min.js” مثل أدناه.

<!DOCTYPE html>
<html>
<head>
<title>الصفحة عينة</title>
<script src="js/generateGoogleDriveUri.min.js"></script>
<script type="text/javascript">
window.onload = function(){

//كائن الصب
var gduObj = new genGDU('وضع رابط لبيانات نشرت هنا');

//توليد URI
var atomUri = gduObj.genUri(
  'atom', // اخترت شكل ATOM.
  {
    startRow:2, //نبدأ من الصف 2
    startCol:1, //تبدأ من عمود 1
    cols:1, //قطع 1 الأعمدة
    rows:5, //قطع 5 الصفوف في كل صفحة
    page:1 //الحصول على الصفحات 1
  }
);

var html = '<a href="' + atomUri + '" target="_blank">' + atomUri + '</a>';
document.getElementById('sample').innerHTML = html;

}
</script>
</head>
<body id="sample"></body>
</html>

< إضافة index.html والإعداد وDrive Notepad >
بعد إضافة Drive Notepad على Chrome، يمكنك العثور على “Text Document” على القائمة من Google Drive الخاص بإنشائها.
add_index_ar
إذا كان في المرة الأولى لاستخدام Drive Notepad، سوف يطلب منك مثل أدناه.
permission_01_en_us
دفع “Login and/or grant app permissions…”، واستعرض مسألة أدناه.
permission_02_ar

الرجاء تغيير اسم الملف إلى “index.html و”. بعد حفظ الملف، أغلق علامة التبويب.
change_file_name_en_us

الرجاء تغيير وضع حول “إدارة التطبيقات”.
manage_apps_ar
يرجى مراجعة “استخدامه افتراضيًا” الصف Drive Notepad.
use_by_default_ar
بعد ذلك، يمكنك استخدام Drive Notepad مثل تطبيقات أخرى على Google Drive.

< تغيير إعدادات المشاركة >
حدد مجلد لتعيين العامة.
بعد ذلك، اتبع الموافقة المسبقة عن علم أدناه.
set_sharing_enabled_01_ar
تعيين “عام على الإنترنت” التحقق.
set_sharing_enabled_02_ar

< إعداد HTML، CSS، Javascript >
استخدام Drive Notepad لإعدادهم.
أو تعديل مع محرر النص الخاص بك وتحميلها.
موقفي النسبي هو مثل أدناه.
my_public_tree_ar

الرابط أدناه هو بلدي صفحة الويب التي تم إنشاؤها باستخدام بيانات Google.
https://googledrive.com/host/0B2hsIY7iHEnLS290OHlmRkFmbU0/
إذا كنت تريد، يرجى استخدام مصادر كما عينة.

< النصي اضافية >
أنا وضعت imgur تحويل URL لصفحة الويب الخاصة بي. إذا كنت تريد، يرجى استخدام هذا.
https://github.com/mecrazy/imgurUrlConverter