html Marquee tag

if you want to create a scrolling functionality of text,images etc in your site and if you dont know/want  javascript for this you can use marqquee tag

marquee tag is supported in almost all modern browsers

the  tag block will be look something like this

<marquee behavior="scroll" direction="left">
<img  src="assets/templates/base/css/images/1.png" alt="" />
<img src="assets/templates/base/css/images/2.png" alt="" />
<img src="assets/templates/base/css/images/3.png" alt="" />
<img src="assets/templates/base/css/images/5.png" alt="" />
</marque>

you can specify which direction it should scroll by changing direction to top,bottom,rigth or left

and if you want to stop scrolling when user mouseover a image/text you can simply stop it and start sliding when user mouseout from image/text like adding this code in marquee tag
onmouseover=”this.stop();” onmouseout=”this.start();

hope this simple tag may help someone

using https with modx

in many cases you want to secure your site in many ways.one of them is https

if you want to use https in your modx cms you can simple use it.

for example if you want to use https for all urls you just need to change a system setting called scheme

just go to system setting and search for scheme setting and change its value to 1

 

in case if you want to have only few selected pages should be accessed with https you just need to create a simple plugin and a template variable

just go to template variables in manager and create one tv with encryption as name use https as caption ,Check Box as input type and Yes==1 as input option values.assign this tv to your template

next create a plugin with a name say simpleSSL

copy this below code

event-&gt;name == 'OnLoadWebDocument') {
    unset($_GET['q']);
    $encryption_value = $modx-&gt;resource-&gt;getTVValue('encryption');
 
    $encryption = false;
    if($encryption_value == 1){
      $encryption = true;
    }
 
    $ssl = false;
    if($_SERVER['HTTPS'] == 1)  {
      $ssl = true;
    }
    elseif($_SERVER['HTTPS'] == 'on'){
      $ssl = true;
    }
    elseif($_SERVER['SERVER_PORT'] == 443) {
      $ssl = true;
    }
 
    if($ssl &amp;&amp; !$encryption) {
      $url = $modx-&gt;makeUrl($modx-&gt;resource-&gt;get('id'), '', http_build_query($_GET), 'http');;
      $modx-&gt;sendRedirect($url);
    }
    else if(!$ssl &amp;&amp; $encryption) {
 
      $url = $modx-&gt;makeUrl($modx-&gt;resource-&gt;get('id'), '', http_build_query($_GET), 'https');
      $modx-&gt;sendRedirect($url);
    }
  }
 
now just check the <strong>OnLoadWebDocument</strong> check box from systemevents tab of this plugin and save it

now just go to any page you want to have hhtps enabled and check the use https tv from template variables in tab in that resource and thats it

in case if you want to create a link with https for a page 5 you just need to change the link tag to [[~5? &scheme=`https`]]

 

if you ever want to secure your manager with https just change htaccess of manager folder to

RewriteEngine On
RewriteBase /
RewriteCond %{SERVER_PORT} 80
RewriteRule ^(.*)$ https://yoursite.com/manager/$1

now your manager will be accessed with htpps only

Note: assumed you have already installed ssl in your site

hope this may help someone

modx cache

in modx your website content is mostly stored in database.apart from the content your custom components will interact more often with database

for every page request instead of depending upon database results all the time you can ache the results

modx already implemented caching in number of ways

all your pages will be cached by default.if you think a page have dynamic content which can be changed all the time you can disable the caching of the page,just by unchecking Cacheable filed in page settings of the document.remeber if the page is cached you cant see the changes immidiatly in frontend

but caching is not only limited to page cache, if your site have large data which can be be used with custom components you can ache the database results programatically

in general modx will store the cached data in core/cache/ folder with sections as folder

for example you have to show your custom hotels data table with snippets .for every user request you are trying to retrieve 100′s of hotels information from database.

$hotels=$modx->getCollection('hotelInformation',array('location'=>'newyork'));
foreach($hotels as $hotel){
	$hotelArray=$hotel->toArray();
//......do whatever you want ......
}

if 10000 users requested for hotel data 1000 times you need to interact with database

in case if the data in databse about the hotel wont change all the time you can ache the results and save database requests whichmakes your site faster

$hotels=$modx->getCollection('hotelInformation',array('location'=>'newyork'));
$cachedHotels=array();
foreach($hotels as $hotel){
	$cachedHotels[]=$hotel->toArray();
}
//we have array of data ready to be cached,now just ache the data
$modx->cacheManager->set('newyorkhotels',$cachedHotels);
 
/* =============================================================================
  from next time onwards whenever users request for newyork hotels
  you will simply use the cached results instead of asking from database
  this caching will give hight perfor,mance to your site while your traffic increases
   ========================================================================== */
 
//the above ached data will be saved in core/ache/default/newyorkhotels.cache.php
//from next user requests
$hotels=$modx->cacheManager->get('newyorkhotels');
if(!$hotels) $hotels=$modx->getCollection('hotelInformation',array('location'=>'newyork'));
foreach($hotels as $hotel){
//--now use this hotel array like you did before
}

you can also specify where to store the cached results and expired time of the ache results

$cachetime=3600;
$cacheOptions = array(
  xPDO::OPT_CACHE_KEY => 'hotels//results',
);
//now the results will be saved in core/cache/hotels//results folder
$cachedHotels==$modx->cacheManager->get('newyorkhotels',$cacheOptions);
if(!$cachedHotels){
$hotels=$modx->getCollection('hotelInformation',array('location'=>'newyork'));
 
foreach($hotels as $hotel){
	$cachedHotels[]=$hotel->toArray();
}
$modx->cacheManager->set('newyorkhotels',$data,$cachetime,$cacheOptions);
}
foreach($cachedHotels as $hotel){
//--now use this hotel array like you want
}

you not use caching with db results .you can also use it with external feeds,external API integrations.cache will be more usefull when your site traffic is hight
i hope this will help someone who is dealing with complex data

change font size of site

For accesablity reason you may want to add a widget which will allow visitors to increase or decrase the font size

creating this widget is simple. first .you just make sure you have specified font size for all selector in percentile(ex:110%,120% etc)

for example if you can give css for selectors like this

body{font-size:13px; font-family:arial}
h1{ font-size:180%}
h2{ font-size:160%}
h3{ font-size:140%}
h4{ font-size:120%}
p,#container,.content{ font-size:100%}
#menu li a{ font-size:110%}

now create a widget like this
change font-widget

<div id="site-fonts">
	  <span>change text size</span>
	  <a id="font-increase" href="#"></a>
	  <a id="font-decrease" href="#"></a>
 
</div>

css for the above widget

#font-increase,#font-decrease{ margin:0 3px; height:17px; width:17px; height:17px; text-decoration:none;}
#font-increase{ background:url(images/font-increase.png) no-repeat;}
#font-decrease{background:url(images/font-decrease.png) no-repeat;}

add the above widget in your webpage better on top

if you are suing jquery simply add this javascript code

<script type="text/javascript">
function changeFont(){
 
	$('#font-increase').click(function(event){
		event.preventDefault();
		font=$('body').css('font-size');
		font=parseInt(font.replace('px',''));
		font=font+1;
		$('body').css('font-size',font+'px');
	});
	$('#font-decrease').click(function(event){
		event.preventDefault();
		font=$('body').css('font-size');
		font=parseInt(font.replace('px',''));
		font=font-1;
		$('body').css('font-size',font+'px')
	});
}
   $(document).ready(function() {
   	changeFont();
    });
</script>

incase if you are using mootools

<script type="text/javascript">
function changeFont(){
 
	$('#font-increase').addEvent('click',function(event){
		event.stop();
		font=$('body').getStyle('font-size').replace('px','').toInt();
		font=font+1;
		$('body').setStyle('font-size',font+'px');
	});
	$('#font-decrease').addEvent('click',function(event){
		event.stop();
		font=$('body').getStyle('font-size').replace('px','').toInt();
		font=font-1;
		$('body').setStyle('font-size',font+'px')
	});
}
   window.addEvent('domready',function(){
   	changeFont();
   });
</script>

you are done.now visitors can click the increase and decrease links to change text size in your site and your site have a extra accesabity feature

modx login redirecting user to referred page

Redirecting user to referred page

while using modx login you may want to redirect user to the referred page after successfull login .we can do this easily as Login component already have a property called redirectToPrior

for example when you send user to login page from about us page ,after user is suucessfully logged you want him to redirect to same aboutus page

iam creating a simple snippet to show login and logot links based on present user authentication status and also setting HTTP_REFERER which is used later in login snippet.create a snippet called logintopbar

<?php
$output='';
//assuming login page id is 5
$log_url=$modx->makeUrl(5);
if($modx->user->isAuthenticated()){
  $output.='<span><a href="'.$log_url.'?service=logout">logout</a></span>';
}
else{
  $_SERVER['HTTP_REFERER']=$_SERVER["REQUEST_URI"];
 
  $output.='<span><a href="'.$log_url.'">login</a></span>';
}
return $output;

we are simply grabbing links and also setting HTTP_REFERER to present url . now place this snippet [[!logintopbar]] in your template .so when you click that link it goes to login page

in login page while calling login snippet set redirectToPrior to TRUE like [[Login? &redirectToPrior=`true` ]]

now user will be redirected to referred page

hope this may help some one