WBCE CMS Forum

WBCE CMS – Way Better Content Editing.

Du bist nicht angemeldet.

#1 17.01.2021 17:28:07

wilsteraner
Mitglied

NWI Anywhere - Bild im Slider / Textumfluss

Tut mir leid, daß ich schon wieder nerven muss...

Wenn ich möchte, daß der Text das Bild rechts umfließt, wo muß ich dem Bild dann ein float verpassen? In der nia.css?

Muß das dann so aussehen:

div.mod_nia img {
float: left;
 

Bei mir passiert da irgendwie nichts. Auch nicht, wenn ich z.B. div.mod_nia h2 ändere.

Offline

#2 17.01.2021 17:31:13

florian
Administrator

Re: NWI Anywhere - Bild im Slider / Textumfluss

So aus dem kalten schwer zu sagen.
Poste mal die komplette display_mode_?.htt, die Du verwendest.


Code allein macht nicht glücklich. Jetzt spenden!

Offline

#3 17.01.2021 18:31:27

wilsteraner
Mitglied

Re: NWI Anywhere - Bild im Slider / Textumfluss

<script type="text/javascript">
	// check if jQuery is included via template index.php or equivalent method
	showJqueryStatus("Anynews (jQuery Liquid Slider)");

	// include Liquid Slider plugin files
	$.include([
		// load thirdparty jQuery plugin components of Liquid Slider
		'{{ WB_URL }}/modules/news_img_anywhere/thirdparty/liquidslider/css/liquid-slider.css',
		'{{ WB_URL }}/modules/news_img_anywhere/thirdparty/liquidslider/js/jquery.easing.min.js',
		'{{ WB_URL }}/modules/news_img_anywhere/thirdparty/liquidslider/js/jquery.touchSwipe.min.js',
		'{{ WB_URL }}/modules/news_img_anywhere/thirdparty/liquidslider/js/jquery.liquid-slider.min.js',
	
		// include YOUR Liquid Slider configuration and CSS changes (adjust these two files to your needs)
		'{{ WB_URL }}/modules/news_img_anywhere/css/liquid-slider-custom.css',
		'{{ WB_URL }}/modules/news_img_anywhere/javascript/liquid-slider-config.js'
	]); 
</script>	

<div class="mod_nia">
	
	
	{% if newsItems %}
		<div class="liquid-slider" id="nia-liquid-slider">
			{% for news in newsItems %}
				{% if news.TS_POSTED_WHEN > 0 %}
					<div>
						<h2><a href="{{ news.LINK }}">{{ news.TITLE }}</a></h2>
						<a href="{{ news.LINK }}"><img src="{{ news.IMAGE }}" /></a>
						{{ news.CONTENT_SHORT }}
						{% if news.CONTENT_LONG %}
							<a href="{{ news.LINK }}">{{ lang.TXT_READMORE }}</a>
						{% endif %}
					</div>
				{% endif %}
			{% endfor %}
		</div>
	
	{% else %}
		{{ lang.TXT_NO_NEWS }}
	{% endif %}
</div>

Es ist zu den bereits vorhandenen .htt nicht viel geändert worden.

Offline

#4 17.01.2021 19:04:45

florian
Administrator

Re: NWI Anywhere - Bild im Slider / Textumfluss

Ist das Absicht, dass Du den Displaymode genommen hast, der eigentlich für die Darstellung der News als Slider gedacht ist?
"Eigentlich" deshalb, weil das Ding vorne und hinten nicht funktioniert - das hatte ich ohne nachzudenken bzw. Test aus dem alten Anynews übernommen.
Wenn Du die Darstellung als Slider willst, ändere den Code bitte auf

<link rel="stylesheet" type="text/css" href="{{ WB_URL }}/modules/news_img_anywhere/thirdparty/liquidslider/css/liquid-slider.css" />
<script src="{{ WB_URL }}/modules/news_img_anywhere/thirdparty/liquidslider/js/jquery.easing.min.js"></script>
<script src="{{ WB_URL }}/modules/news_img_anywhere/thirdparty/liquidslider/js/jquery.touchSwipe.min.js"></script>
<script src="{{ WB_URL }}/modules/news_img_anywhere/thirdparty/liquidslider/js/jquery.liquid-slider.min.js"></script>

<div class="mod_nia">
	<h2>{{ lang.TXT_HEADER }}</h2>
	
	{% if newsItems %}
		<div class="liquid-slider" id="nia-liquid-slider">
			{% for news in newsItems %}
				{% if news.TS_POSTED_WHEN > 0 %}
					<div>
						<h2>{{ news.TITLE }}</h2>
						<img src="{{ news.IMAGE }}" />
						{{ news.CONTENT_SHORT }}
						{% if news.CONTENT_LONG %}
							<a href="{{ news.LINK }}">{{ lang.TXT_READMORE }}</a>							
						{% endif %}
						<br clear="all">
					</div>
				{% endif %}
			{% endfor %}
		</div>
	
	{% else %}
		{{ lang.TXT_NO_NEWS }}
	{% endif %}
</div>

<script>
jQuery(function($) {
  $('#nia-liquid-slider').liquidSlider({
	autoSlide:true
  });
});
</script>

<style>
.liquid-slider div img {
float:left;
margin-right:10px;
}

</style>

Für die "normale" Listenansicht display_mode_1.htt verwenden und etwas anpassen:

<div class="mod_nia">
	<h2>{{ lang.TXT_HEADER }}</h2>
	
	{% for news in newsItems %}
		{% if news.TS_POSTED_WHEN > 0 %}
			<img src="{{ news.IMAGE }}" />		
			<p>
				<strong>{{ news.TITLE }} ({{ news.TS_POSTED_WHEN | date(lang.DATE_FORMAT) }})</strong>
			</p>
				
			
	
			{{ news.GROUP_IMAGE }} 
			{{ news.CONTENT_SHORT}}
			
			{% if news.CONTENT_LONG %}
				<a href="{{ news.LINK }}">{{ lang.TXT_READMORE }}</a>
			{% endif %}
			<hr />
		{% endif %}
	
	{% else %}
		{{ lang.TXT_NO_NEWS }}
	{% endfor %}

</div>

<style>
.mod_nia img {
float:left;
margin-right:10px;
}

hr {
clear:both;
}
</style>

Code allein macht nicht glücklich. Jetzt spenden!

Offline

#5 17.01.2021 22:04:48

wilsteraner
Mitglied

Re: NWI Anywhere - Bild im Slider / Textumfluss

Wenn ich ehrlich bin, habe ich einfach alle Displaymodes ausprobiert und dann den angepasst, der der alten Darstellung am nächsten kam. Diesen habe ich dann etwas angepasst.

Ich werd dann den Displamode1 nehmen und versuchen den so anzupassen, wie ich es gerne hätte. Zur Not muß ich mich hier wohl noch mal zu Wort melden  smile

Vielen Dank erst mal.

Offline

Fußzeile des Forums

up