اشتراکها
میزبانی مخازن گیت در هاست سی پنل
چند سالی ست که شبکههای اجتماعی رشد چشمگیری در دنیای مجازی داشتهاند و به حرف اول و پیشتاز آن بدل شدهاند. این شبکهها در همهی زمینهها از معرفی و فروش محصولات گرفته تا معرفی سایت و وبلاگ و ... بکار گرفته میشوند و لذا مقولهی بهینه سازی یک وب سایت برای این شبکههای اجتماعی امری ناگزیر است. مباحث سئو که پیرامون بهینه سازی یک وب سایت برای موتورهای جستجو میباشند، امروزه با پدیدهی جدید دیگری آمیخته شدهاند و به تعاریف قدیمی و معمول، گزینههایی افزوده شده است. از اینرو شناخت و بکارگیری روشهای بهینه، برای این مباحث ضروری میباشند.
همانطور که میدانید هنگامیگه در ادیتور ارسال مطلب یکی از شبکههای اجتماعی (فیسبوک ، توییتر ، گوگل پلاس و ...) آدرس سایتی را وارد میکنید، بلافاصله لینک پردازش شده و پیش نمایشی از آن وبسایت در ادیتور نمایش داده میشود. برخی پیش نمایشها حاوی عکس، عنوان لینک و خیلی منظم هستند و برخی دیگر فقط نام و عنوان سایت را در برمیگیرند.
برای نمونه به تصاویر زیر دقت کنید:
همانطور که میبینید، تنها لینکی ساده، بدون هیچ پیش نمایشی از وب سایت نشان داده شده است.
دلیل این اتفاق وجود یا عدم وجود متاتگهایی که Social Media Metadata نامیده میشوند میباشند. چنانچه وب سایتی بوسیلهی این متاتگها برای شبکههای اجتماعی بهینه سازی شده باشد، با قرار دادن هر لینکی در ادیتور شبکههای اجتماعی، پیش نمایشی خوب از آن مطلب به نمایش گذاشته میشود. اهمیت این متاتگها در سایتهای خبری، فروشگاهها، سایتهای آموزشی و ... بسیار بالا میباشد تا از مزایای جذب کاربر توسط شبکههای اجتماعی بهرهمند شوند. با این مقدمه میرویم به سراغ معرفی و چگونگی بکارگیری این متاتگ ها.
بخش اول: متاتگهای موردنیاز برای لینکهای حاوی مقالات:
ابتدا تگ html خود را به شکل زیر تغییر دهید:
برای شناخت و اهمیت بکارگیری خصوصیت itemscope میتوانید اینجا را ببینید. این خصوصیت زوجهای کلید/مقداری را تعریف میکند که جزئی از سند میباشند. در ادامه itemtype به تشریح یک زوج کلید/مقدار میپردازد که به مرورگر میگوید کدام آیتمها برای یک مقاله بهینه شدهاند.
بخش دوم: متاتگهای موردنیاز برای لینکهای حاوی محصولات:
ابتدا تگ html خود را به شکل زیر تغییر دهید:
و در نهایت متاتگهای زیر را به صفحه خود اضافه کنید:
در پایان
برای مشاهده لیست کاملی از اسکیما اینجا را ببینید.
og مخفف Open Graph Protocol میباشد که میتوانید مطالب کاملی را در مورد آن اینجا بخوانید.
و برای آشنایی بیشتر با TwitterCard هم این لینک را مشاهده کنید.
همانطور که میدانید هنگامیگه در ادیتور ارسال مطلب یکی از شبکههای اجتماعی (فیسبوک ، توییتر ، گوگل پلاس و ...) آدرس سایتی را وارد میکنید، بلافاصله لینک پردازش شده و پیش نمایشی از آن وبسایت در ادیتور نمایش داده میشود. برخی پیش نمایشها حاوی عکس، عنوان لینک و خیلی منظم هستند و برخی دیگر فقط نام و عنوان سایت را در برمیگیرند.
برای نمونه به تصاویر زیر دقت کنید:
تصویر فوق مربوط به لینک یک سایت خبری در ادیتور فیسبوک میباشد. همانطور که میبینید عنوان خبر، عکس و توضیح مختصری در مورد خبر، با نظم و ترتیبی خاص نمایش داده شده است.
حال به تصویر زیر که مربوط به لینکی از همین سایت میباشد دقت کنید:
همانطور که میبینید، تنها لینکی ساده، بدون هیچ پیش نمایشی از وب سایت نشان داده شده است.
دلیل این اتفاق وجود یا عدم وجود متاتگهایی که Social Media Metadata نامیده میشوند میباشند. چنانچه وب سایتی بوسیلهی این متاتگها برای شبکههای اجتماعی بهینه سازی شده باشد، با قرار دادن هر لینکی در ادیتور شبکههای اجتماعی، پیش نمایشی خوب از آن مطلب به نمایش گذاشته میشود. اهمیت این متاتگها در سایتهای خبری، فروشگاهها، سایتهای آموزشی و ... بسیار بالا میباشد تا از مزایای جذب کاربر توسط شبکههای اجتماعی بهرهمند شوند. با این مقدمه میرویم به سراغ معرفی و چگونگی بکارگیری این متاتگ ها.
بخش اول: متاتگهای موردنیاز برای لینکهای حاوی مقالات:
ابتدا تگ html خود را به شکل زیر تغییر دهید:
<html itemscope itemtype="http://schema.org/Article">
<title>عنوان صفحه ، حداکثر 60 تا 70 کارکتر باشد</title> <meta name="description" content="شرح صفحه ، حداکثر 150 کارکتر باشد" /> <!-- Schema.org markup for Google+ --> <meta itemprop="name" content="نام یا عنوان صفحه"> <meta itemprop="description" content="شرح صفحه"> <meta itemprop="image" content="نشانی اینترنتی عکسی که در پیشنمایش نشان داده میشود"> <!-- Twitter Card data --> <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:site" content="کپی رایت نام سایت"> <meta name="twitter:title" content="نام یا عنوان صفحه"> <meta name="twitter:description" content="شرح صفحه"> <meta name="twitter:creator" content="نویسنده"> <!-- Picture size at least 280x150px -->عکس پیشنمایش با ابعاد حداقل <meta name="twitter:image:src" content="نشانی اینترنتی عکس مطلب"> <!-- Open Graph data --> <meta property="og:title" content="عنوان صفحه" /> <meta property="og:type" content="article" /> <meta property="og:url" content="نشانی سایت" /> <meta property="og:image" content="نشانی عکس مطلب" /> <meta property="og:description" content="شرح مطلب" /> <meta property="og:site_name" content="نام سایت" /> <meta property="article:published_time" content="تاریخ انتشار" /> <meta property="article:modified_time" content="تاریخ بروزرسانی" /> <meta property="article:section" content="نام بخش محتوی متن مقاله" /> <meta property="article:tag" content="نام تگ محتوی متن مقاله" /> <meta property="fb:admins" content="شناسه عددی کاربری شما در فیسبوک" />
بخش دوم: متاتگهای موردنیاز برای لینکهای حاوی محصولات:
ابتدا تگ html خود را به شکل زیر تغییر دهید:
<html itemscope itemtype="http://schema.org/Product">
<title>عنوان صفحه</title> <meta name="description" content="شرح صفحه" /> <!-- Schema.org markup for Google+ --> <meta itemprop="name" content="عنوان صفحه"> <meta itemprop="description" content="Tشرح صفحه"> <meta itemprop="image" content="نشانی عکس محصول یا کالا"> <!-- Twitter Card data --> <meta name="twitter:card" content="product"> <meta name="twitter:site" content="کپی رایت سایت"> <meta name="twitter:title" content="عنوان صفحه"> <meta name="twitter:description" content="شرح محصول یا کالا"> <meta name="twitter:creator" content="نویسنده"> <meta name="twitter:image" content="نشانی عکس محصول یا کالا"> <meta name="twitter:data1" content="قیمت محصول یا کالا"> <meta name="twitter:label1" content="Price"> <meta name="twitter:data2" content="رنگ کالا یا محصحول"> <meta name="twitter:label2" content="Color"> <!-- Open Graph data --> <meta property="og:title" content="عنوان صفحه" /> <meta property="og:type" content="article" /> <meta property="og:url" content="نشانی سایت" /> <meta property="og:image" content="عکس محصول یا کالا" /> <meta property="og:description" content="شرح مصحول" /> <meta property="og:site_name" content="نام سایت" /> <meta property="og:price:amount" content="قیمت محصول یا کالا" /> <meta property="og:price:currency" content="واحد ارزی قیمت" />
در پایان
برای مشاهده لیست کاملی از اسکیما اینجا را ببینید.
og مخفف Open Graph Protocol میباشد که میتوانید مطالب کاملی را در مورد آن اینجا بخوانید.
و برای آشنایی بیشتر با TwitterCard هم این لینک را مشاهده کنید.
خیر به هیچ وجه این اتفاق نمیتونه بیوفته. طرح این سوال، مثل افراد تازه کاری هست که بعد از گرفتن یک ایده سریعا میرن پای لپ تاپ و New Project باز میکنن. در واقع اصلا موضوع سر اوپن سورس بودن و این داستانها نیست.
در تولید چنین نرم افزارهایی باید در درجه اول به بازار و هدف اون نرم افزار در جامعه نگاه کرد و سنجید که آیا مصرف کننده داره یا خیر!
در فضای فعلی این امر به هیچ وجه امکان پذیر نیست و مردم ترجیح میدن اطلاعاتشون در دست کشورهای دیگه باشه تا کشور خودشون و علتش هم گویاست و نیازی به تشریح نداره (وارد بحث سیاست نمیشم اینجا مکانش نیست) .
حتی در صورت تولید و انتشار کدهای نرم افزار، باز هم دلیل بر ایجاد حس امنیت برای کاربران نمیشه چون ملت نمیتونن کدهای سرور رو نگاه کنن و ببینن آیا واقعا همون کدها آپلود شده یا خیر!
برای درک بیشتر این موضوع رجوع کنید به اون داستان کارخانه تولید ایران خودرو که خودرویی که برای تست باید تحویل به سازمان تست و ایمنی میداد، یک نسخه سفارشی بود و نمره دریافت میکرد.
در واقع به طور خلاصه، برای تولید و فعالیت چیزهایی در سطح کشوری یا بین المللی (کارخانه، نرم افزار و ...)، نیاز به محیط سالم هست نه کدهای اوپن سورس.
در تولید چنین نرم افزارهایی باید در درجه اول به بازار و هدف اون نرم افزار در جامعه نگاه کرد و سنجید که آیا مصرف کننده داره یا خیر!
در فضای فعلی این امر به هیچ وجه امکان پذیر نیست و مردم ترجیح میدن اطلاعاتشون در دست کشورهای دیگه باشه تا کشور خودشون و علتش هم گویاست و نیازی به تشریح نداره (وارد بحث سیاست نمیشم اینجا مکانش نیست) .
حتی در صورت تولید و انتشار کدهای نرم افزار، باز هم دلیل بر ایجاد حس امنیت برای کاربران نمیشه چون ملت نمیتونن کدهای سرور رو نگاه کنن و ببینن آیا واقعا همون کدها آپلود شده یا خیر!
برای درک بیشتر این موضوع رجوع کنید به اون داستان کارخانه تولید ایران خودرو که خودرویی که برای تست باید تحویل به سازمان تست و ایمنی میداد، یک نسخه سفارشی بود و نمره دریافت میکرد.
در واقع به طور خلاصه، برای تولید و فعالیت چیزهایی در سطح کشوری یا بین المللی (کارخانه، نرم افزار و ...)، نیاز به محیط سالم هست نه کدهای اوپن سورس.
نظرسنجیها
کدام روش مدیریت پروژه مناسبتر است؟
هر کسی بتواند یک ماژول را ۰ تا ۱۰۰ انجام بدهد و نهایتا ماژول انجام شده خود را به پروژه وصل کند.(مثلا دیتابیس را طراحی کند سرویس ها را اماده کند و رابط کاربری را پیاده کند و هر سه قسمت را به هم وصل کند و نهایتا متخصصان هر حوزه بازبینی خود را در هر قسمت انجام دهند و اصلاحات لازم در صورت نیاز انجام شوند).
هر کسی در حوزه کاری خود تمرکز کند و کاملا تخصصی در حوزه کاری خود انجام وظیفه نماید. (مثلا متخصص Back-End در حوزه خود، متخصص Front-End در حوزه خود فعالیت کنند و کارها تفکیک شده باشند).
هر کسی در حوزه کاری خود تمرکز کند و کاملا تخصصی در حوزه کاری خود انجام وظیفه نماید. (مثلا متخصص Back-End در حوزه خود، متخصص Front-End در حوزه خود فعالیت کنند و کارها تفکیک شده باشند).
'من کتاب تجارت الکترونیکی اقای افراشته مهر رو خوندم. واقعا کتاب محشری هستش'
ولی بنظرم من اینطور نیست! کار با ADO برای قبل از محبوب شدن ORMها و اومدن Entity framework هستش، برنامه نویسی با این تکنولوژیها بنظرم مرده . این سایت نویسندش هست زبان اصلی این کتاب رو من بهتر متوجه شدم ( ترجمهی آقای افراشته مهر هم زیاد جالب نبود ، تالیف زیادی به کار نبرده بود ، فقط ترجمه این بده! ) .
نظرات مطالب
iTextSharp و استفاده از قلمهای محدود فارسی
یک نکتهی تکمیلی
اگر از PDF Report استفاده میکنید، نکتهی FontSelector فوق، به صورت توکار در آن لحاظ شدهاست. بنابراین اولین قلم را در اینجا یک قلم فارسی تعریف کنید:
و دومین قلم را یک قلم کامل انگلیسی. این دو مورد مکمل هم خواهند شد؛ چون قلم فارسی استفاده شده، گلیفهای انگلیسی را ندارد.
اگر از PDF Report استفاده میکنید، نکتهی FontSelector فوق، به صورت توکار در آن لحاظ شدهاست. بنابراین اولین قلم را در اینجا یک قلم فارسی تعریف کنید:
.DefaultFonts(fonts => { fonts.Path(System.IO.Path.Combine(AppPath.ApplicationPath, "fonts\\irsans.ttf"), System.IO.Path.Combine(Environment.GetEnvironmentVariable("SystemRoot"), "fonts\\verdana.ttf")); fonts.Size(9); fonts.Color(System.Drawing.Color.Black); })
در قسمت قبل با نحوه پیاده سازی مسیریابی در AngularJs آشنا شدیم و در این پست میخواهیم نحوه تعریف و ارسال پارامترها به سیستم مسیریاب را فرا بگیریم.
در بالا ما پارامتری به نام orderId وارد کرده ایم که میتوانیم توسط routeParams$ در کنترلر به آن دست پیدا کنیم :
فراموش نکنید که باید پارامتر routeParams$ را به کنترلر خود تزریق کنید.
محتوای فایل index.html را نیز به صورت زیر تغییر دهید :
برنامه را اجرا کنید تا نتیجه را ببینید.
بارگزاری Viewهای محلی توسط تگ <script> :
برای درک بهتر مثالی را تهیه میکنیم .
سپس دو کنترلر زیر را نیز به آن اضافه کنید :
فایلی به نام index2.html برای صفحه اصلی برنامه با محتوای زیر تعریف کنید :
همانطور که مشاهده میکنید در کد بالا از 2 تگ اسکریپت برای قرار دادن محتوای View استفاده کرده ایم که خاصیت type آن برابر با text/ng-template و خاصیت id آن نام View template است و دیگر فایل مجزایی برای Viewها ایجاد نکردیم. Angular به صورت خودکار محتوای داخل تگهای Script را به محض فراخوانی آدرسهای موجود در ویژگی id هر تگ به وسیلهی سیستم مسیر یابی، در داخل دایرکتیو ng-view قرار میدهد.
افزودن دادههای سفارشی به سیستم مسیریابی :
در هر دو مسیر از کنترلر CommonController استفاده کرده ایم با این تفاوت که در مسیر اول یعنی AddNewOrder/ یک خاصیت با نام foodata با مقدار addorder تعریف شده است و در مسیر دوم با مقدار showorder.
مقدار موجود در آن را بخوانیم.
فرض کنید که میخواهیم در لیست سفارشات قسمتی داشته باشیم برای مشاهدهی جزئیات هر سفارش. پس در صفحه نمایش جزئیات کالا نیاز به کد محصول برای واکشی آن داریم. در Angular زمانی که داریم مسیرها را تعریف میکنیم این امکان را هم داریم که پارامترهایی را هم برای هر مسیر مشخص کنیم. برای این کار فایل app.js مثال قبل را باز کنید و مسیر ذیل را به آن اضافه کنید :
when('/showOrderDetails/:orderId', { templateUrl: 'templates/show_order.html', controller: 'ShowOrderController' });
myFirstRoute .controller('ShowOrderController', function($scope, $routeParams) { $scope.order_id = $routeParams.orderId; });
<body ng-app="myFirstRoute" style=" <div> <div> <div> <table dir="rtl"> <thead> <tr> <th>#</th><th>˜کد</th><th>نام محصول</th><th></th> </tr> </thead> <tbody> <tr> <td>1</td><td>1234</td><td>15" Samsung Laptop</td> <td><a href="#showOrderDetails/1234">جزئیات محصول</a></td> </tr> <tr> <td>2</td><td>5412</td><td>2TB Seagate Hard drive</td> <td><a href="#showOrderDetails/5412">جزئیات محصول</a></td> </tr> <tr> <td>3</td><td>9874</td><td>D-link router</td> <td><a href="#showOrderDetails/9874">جزئیات محصول</a></td> </tr> </tbody> </table> <div ng-view></div> </div> </div> </div> <script src="js/bootstrap.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script> <script src="app.js"></script> </body>
نکتهی مهم در کد بالا قرار دادن کد کالا بعد از مسیر است، مانند : showOrderDetails/5412 #
و محتویات فایل templates/show_order.html :
<h2>سفارش شماره #{{order_id}}</h2> محل قرار گیری جزئیات سفارش شماره : <b>#{{order_id}}</b>.
بارگزاری Viewهای محلی توسط تگ <script> :
در بعضی موارد لزومی ندارد که اطلاعات View را از یک فایل دیگر بخوانید و یا حتی اینقدر View شما کوچک است که تمایل دارید آن را به همراه فایل اصلی index.html حمل کنید به جای اینکه آن را در یک فایل جدا نگهداری کنید.
دایرکتیوی به نام ng-template وجود دارد که این امکان را به ما میدهد تا بتوانیم View templateهای کوچکمان را در داخل فایل اصلی قرار دهیم. با استفاده از تگ <script> به شکل زیر میشود این کار را انجام داد :
<script type="text/ng-template" id="add_order.html"> <h2> ثبت سفارش </h2> {{message}} </script>
فایل app.js مثال قبل را باز کنید و مسیرهای زیر را نیز به آن اضافه کنید :
when('/AddNewOrder', { templateUrl: 'add_order.html', controller: 'AddOrderController' }). when('/ShowOrders', { templateUrl: 'show_orders.html', controller: 'ShowOrdersController' });
myFirstRoute.controller('AddOrderController', function($scope) { $scope.message = 'صفحه نمایش ثبت سفارش جدید'; }); myFirstRoute.controller('ShowOrdersController', function($scope) { $scope.message = 'صفحه نمایش لیست سفارشات'; });
<body ng-app="myFirstRoute" style=" <div> <div> <div> <ul> <li><a href="#AddNewOrder"> ثبت سفارش جدید </a></li> <li><a href="#ShowOrders"> نمایش شفارشات </a></li> </ul> </div> <div> <div ng-view></div> </div> </div> </div> <script type="text/ng-template" id="add_order.html"> <h2> ثبت سفارش </h2> {{message}} </script> <script type="text/ng-template" id="show_orders.html"> <h2> نمایش سفارشات </h2> {{message}} </script> <script src="js/bootstrap.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script> <script src="app.js"></script> </body>
پروژه را اجرا کنید تا نتیجه را مشاهده کنید.
افزودن دادههای سفارشی به سیستم مسیریابی :
بیشتر اوقات ممکن است نیاز داشته باشید تا دادههای خاصی را در مسیرهای معینی ارسال کنید. برای مثال ممکن است شما بخواهید از یک کنترلر در مسیرهای مختلف استفاده کنید و برای هر مسیر یک دادهی خاص را نیز ارسال میکنید. به مثال زیر توجه کنید :
when('/AddNewOrder', { templateUrl: 'templates/add_order.html', controller: 'CommonController', foodata: 'addorder' }). when('/ShowOrders', { templateUrl: 'templates/show_orders.html', controller: 'CommonController', foodata: 'showorders' }); sampleApp.controller('CommonController', function($scope, $route) { //access the foodata property using $route.current var foo = $route.current.foodata; alert(foo); });
ما میتوانیم با تزریق route$ به کنترلرمان، توسط دستور :
$route.current.foodata
امضای چندگانه ( Multi-signature ) به عنوان تأیید اعتبار چند علامتی یا چند عاملی شناخته میشود، یک ویژگی امنیتی است که برای محافظت از داراییهای دیجیتالی مانند ارز دیجیتال، امضای دیجیتال و سایر اطلاعات حساس استفاده میشود. این فرآیندی است که شامل الزام چندین طرف برای مجوز معامله یا اقدام، به جای تنها یک فرد است. این یک لایه امنیتی اضافی ایجاد میکند و خطر کلاهبرداری، سرقت یا دسترسی غیرمجاز را کاهش میدهد.